diff --git a/packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04-rc/generated_docs_data.json b/packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04/generated_docs_data.json similarity index 69% rename from packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04-rc/generated_docs_data.json rename to packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04/generated_docs_data.json index ca8fa5b5ae..9a5fbd0f57 100644 --- a/packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04-rc/generated_docs_data.json +++ b/packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04/generated_docs_data.json @@ -169,6 +169,13 @@ "value": "RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >", "description": "A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options." }, + { + "filePath": "src/surfaces/admin/extension-targets.ts", + "syntaxKind": "PropertySignature", + "name": "admin.app.intent.render", + "value": "RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >", + "description": "Renders an admin extension for handling app intents." + }, { "filePath": "src/surfaces/admin/extension-targets.ts", "syntaxKind": "PropertySignature", @@ -696,7 +703,7 @@ "description": "A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules." } ], - "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n}" + "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n\n /**\n * Renders an admin extension for handling app intents.\n */\n 'admin.app.intent.render': RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >;\n}" }, "RenderExtension": { "filePath": "src/extension.ts", @@ -744,29 +751,28 @@ "Avatar": { "filePath": "src/surfaces/admin/components.ts", "name": "Avatar", - "description": "Configure the following properties on the avatar component.", - "isPublicDocs": true, + "description": "An avatar displays a user or entity image with fallback initials when the image isn't available.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "initials", "value": "string", - "description": "The initials to display in the avatar when no image is provided or fails to load. Typically one or two characters representing a person's first and last name initials, such as \"JD\" for John Doe." + "description": "The initials to display when no image is provided or if the image fails to load." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The URL or path to the avatar image. When provided, the image takes priority over `initials`. If the image fails to load or loads slowly, `initials` will be rendered as a fallback." + "description": "The URL of the avatar image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"base\" | \"large\" | \"large-200\"", - "description": "The size of the avatar image.\n\n- `small-200`: Extra small avatar, suitable for compact displays or lists with many items.\n- `small`: Small avatar, good for secondary contexts or tight layouts.\n- `base`: Default size that works well in most contexts.\n- `large`: Large avatar for emphasis or when the avatar is a focal point.\n- `large-200`: Extra large avatar for prominent display.", + "description": "The size of the avatar.", "defaultValue": "'base'" }, { @@ -774,7 +780,14 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the avatar for accessibility.\n\nProvides a text description of the avatar for users with assistive technology and serves as a fallback when the avatar fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an avatar, it reads this description aloud. When an avatar fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt)." + "description": "Alternative text that describes the avatar for screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -821,7 +834,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -829,17 +842,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Avatar extends PreactCustomElement implements AvatarProps {\n accessor initials: AvatarProps['initials'];\n accessor src: AvatarProps['src'];\n accessor size: AvatarProps['size'];\n accessor alt: AvatarProps['alt'];\n constructor();\n}" + "value": "declare class Avatar extends PolarisCustomElement implements AvatarProps {\n /**\n * The initials to display when no image is provided or if the image fails to load.\n */\n initials: AvatarProps['initials'];\n /**\n * The URL of the avatar image to display.\n */\n src: AvatarProps['src'];\n /**\n * The size of the avatar.\n */\n size: AvatarProps['size'];\n /**\n * Alternative text that describes the avatar for screen readers.\n */\n alt: AvatarProps['alt'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -862,68 +889,75 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred." + "description": "" } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" }, "Badge": { "filePath": "src/surfaces/admin/components.ts", "name": "Badge", - "description": "Configure the following properties on the badge component.", - "isPublicDocs": true, + "description": "The badge custom element class that renders status indicators in the Shopify admin interface. This component displays compact visual indicators with customizable tones, sizes, and optional icons to communicate status information to merchants.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"strong\"", - "description": "Controls the visual weight and emphasis of the badge.\n\n- `base`: Standard weight with moderate emphasis, suitable for most use cases.\n- `strong`: Increased visual weight for higher emphasis and prominence.", - "defaultValue": "'base'" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the badge to provide additional visual context or reinforce the badge's meaning. Accepts any icon name from the icon library or a custom string identifier." + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"strong\"", + "description": "The visual weight of the badge. Available options: `'base'` for standard weight or `'strong'` for increased emphasis.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the badge.\n\n- `base`: Default size suitable for most badge use cases.\n- `large`: Larger badge for increased visibility and prominence.\n- `large-100`: Extra large badge for maximum visibility in emphasized contexts.", + "description": "The size of the badge. Available options: `'base'` for standard size, `'large'` for larger size, or `'large-100'` for extra large size.", "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", - "defaultValue": "'auto'" + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -970,7 +1004,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -978,17 +1012,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Badge extends PreactCustomElement implements BadgeProps {\n accessor color: BadgeProps['color'];\n accessor icon: BadgeProps['icon'];\n accessor size: BadgeProps['size'];\n accessor tone: BadgeProps['tone'];\n constructor();\n}" + "value": "declare class Badge extends BadgeBase implements BadgeProps {\n /**\n * The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: BadgeProps['icon'];\n /**\n * The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.\n */\n tone: BadgeProps['tone'];\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "Banner": { "filePath": "src/surfaces/admin/components.ts", "name": "Banner", - "description": "Configure the following properties on the banner component.", - "isPublicDocs": true, + "description": "A custom element for displaying important messages and notifications.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -1003,7 +1058,7 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.", + "description": "The color tone of the banner based on its semantic meaning.", "defaultValue": "'auto'" }, { @@ -1011,7 +1066,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Controls whether the banner is visible or hidden.\n\nWhen using a controlled component pattern and the banner is `dismissible`, update this property to `true` when the `dismiss` event fires.\n\nYou can hide the banner programmatically by setting this to `true` even if it's not `dismissible`.", + "description": "Whether the banner is hidden from view.", "defaultValue": "false" }, { @@ -1019,9 +1074,16 @@ "syntaxKind": "PropertyDeclaration", "name": "dismissible", "value": "boolean", - "description": "Whether the banner displays a close button that allows users to dismiss it.\n\nWhen the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, any animation completes, and the `afterhide` event fires.", + "description": "Whether the banner can be dismissed by the user.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -1067,7 +1129,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -1075,24 +1137,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Banner extends PreactCustomElement implements BannerProps {\n accessor heading: BannerProps['heading'];\n accessor tone: BannerProps['tone'];\n accessor hidden: BannerProps['hidden'];\n accessor dismissible: BannerProps['dismissible'];\n constructor();\n}" + "value": "declare class Banner extends PolarisCustomElement implements BannerProps {\n /**\n * The heading text displayed at the top of the banner.\n */\n heading: BannerProps['heading'];\n /**\n * The color tone of the banner based on its semantic meaning.\n */\n tone: BannerProps['tone'];\n /**\n * Whether the banner is hidden from view.\n */\n hidden: BannerProps['hidden'];\n /**\n * Whether the banner can be dismissed by the user.\n */\n dismissible: BannerProps['dismissible'];\n constructor();\n}" }, "Box": { "filePath": "src/surfaces/admin/components.ts", "name": "Box", - "description": "Configure the following properties on the box component.", - "isPublicDocs": true, + "description": "A box is a container component that provides control over layout, spacing, and styling.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -1100,7 +1176,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -1108,7 +1184,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -1116,7 +1192,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -1124,7 +1200,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -1132,7 +1208,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -1140,7 +1216,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -1148,7 +1224,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -1156,7 +1232,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -1164,7 +1240,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -1172,7 +1248,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1180,7 +1256,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1188,7 +1264,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1196,7 +1272,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1204,7 +1280,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1212,7 +1288,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1220,7 +1296,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -1240,7 +1316,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -1248,7 +1324,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -1256,7 +1332,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -1264,7 +1340,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -1272,14 +1348,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -1287,9 +1363,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -1335,7 +1418,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -1343,8 +1426,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Box extends BoxElement implements BoxProps {\n constructor();\n}" @@ -1353,120 +1451,106 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -1474,60 +1558,60 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "Button": { "filePath": "src/surfaces/admin/components.ts", "name": "Button", - "description": "Configure the following properties on the button component.", - "isPublicDocs": true, + "description": "The button custom element class that renders interactive buttons in the Shopify admin interface. This component triggers actions or navigation when clicked, with customizable visual styles, states, and optional icons.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", - "defaultValue": "false" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier." + "name": "variant", + "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", + "description": "The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.", + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "loading", - "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", - "defaultValue": "false" + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "variant", - "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "defaultValue": "'auto'" + "name": "disabled", + "value": "boolean", + "description": "Whether the button is disabled, preventing any interaction. When `true`, the button appears visually disabled and doesn't respond to user clicks.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" + "name": "loading", + "value": "boolean", + "description": "Whether the button is in a loading state. When `true`, displays a loading indicator and prevents interaction to show that an action is in progress.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to open the linked document when the button acts as a link. Available options: `''`, `'_blank'`, `'_self'`, `'_parent'`, or `'_top'`.", "defaultValue": "'auto'" }, { @@ -1535,21 +1619,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "A URL that the button should navigate to when clicked. When provided, the button behaves as a link." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Prompts the user to save the linked URL as a file with the specified filename. Only works when `href` is provided." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The button's behavior in forms. Available options: `'button'`, `'submit'`, or `'reset'`.", "defaultValue": "'button'" }, { @@ -1557,7 +1641,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the button's purpose for screen readers. This is essential for accessibility when the button doesn't have visible text." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "inlineSize", + "value": "\"auto\" | \"fill\" | \"fit-content\"", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -1604,7 +1703,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -1612,15 +1711,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -1628,38 +1742,36 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Button extends Button_base implements ButtonProps {\n accessor disabled: ButtonProps['disabled'];\n accessor icon: ButtonProps['icon'];\n accessor loading: ButtonProps['loading'];\n accessor variant: ButtonProps['variant'];\n accessor tone: ButtonProps['tone'];\n accessor target: ButtonProps['target'];\n accessor href: ButtonProps['href'];\n accessor download: ButtonProps['download'];\n accessor type: ButtonProps['type'];\n accessor accessibilityLabel: ButtonProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Button\n extends ButtonBase\n implements ButtonProps\n{\n /**\n * The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: ButtonProps['icon'];\n /**\n * The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.\n */\n variant: ButtonProps['variant'];\n /**\n * The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.\n */\n tone: ButtonProps['tone'];\n constructor();\n}" }, "AnyString": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AnyString", "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true + "description": "Prevents widening string literal types in a union to `string`." }, "ButtonGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "ButtonGroup", - "description": "Configure the following properties on the button group component.", - "isPublicDocs": true, + "description": "A button group that arranges multiple buttons together with consistent spacing and semantic grouping for related actions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "\"base\" | \"none\"", - "description": "The spacing between buttons in the group.\n\n- `base`: Standard spacing that provides clear visual separation between buttons.\n- `none`: No spacing, creating a connected button group.", + "description": "The amount of spacing between buttons in the group, affecting the visual separation of actions.", "defaultValue": "'base'" }, { @@ -1667,7 +1779,21 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, describing the purpose of this group of buttons." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -1693,14 +1819,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -1714,7 +1832,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -1722,39 +1840,68 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ButtonGroup\n extends PreactCustomElement\n implements ButtonGroupProps\n{\n accessor gap: ButtonGroupProps['gap'];\n accessor accessibilityLabel: ButtonGroupProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class ButtonGroup extends ButtonGroupBase implements ButtonGroupProps {\n constructor();\n}" }, "Checkbox": { "filePath": "src/surfaces/admin/components.ts", "name": "Checkbox", - "description": "Configure the following properties on the checkbox component.", - "isPublicDocs": true, + "description": "A checkbox that lets users select or deselect an option, with support for an indeterminate state.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "indeterminate", "value": "boolean", - "description": "Whether the checkbox displays in an indeterminate state (neither checked nor unchecked), typically used to indicate partial selection in hierarchical lists.\n\nThis visual state takes priority over the `checked` prop in appearance only. The form submission value is still determined by the `checked` prop.\n\nIf `indeterminate` has not been explicitly set and hasn't been modified by user interaction, it returns the value of `defaultIndeterminate`." + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultIndeterminate", "value": "boolean", - "description": "The initial indeterminate state for uncontrolled components. Use this when you want the checkbox to start in an indeterminate state but don't need to control it afterward.\n\nThis value applies until `indeterminate` is explicitly set or the user changes the checkbox state by clicking.", + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "labelAccessibilityVisibility", + "value": "\"visible\" | \"exclusive\"", + "description": "", + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -1769,7 +1916,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -1777,28 +1924,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -1821,7 +1968,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -1829,102 +1976,29 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - } - ], - "value": "declare class Checkbox extends PreactCheckboxElement implements CheckboxProps {\n get indeterminate(): CheckboxProps['indeterminate'];\n set indeterminate(indeterminate: CheckboxProps['indeterminate']);\n accessor defaultIndeterminate: CheckboxProps['defaultIndeterminate'];\n constructor();\n}" - }, - "Chip": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Chip", - "description": "Configure the following properties on the chip component.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", - "defaultValue": "'base'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -1971,7 +2045,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -1979,24 +2053,154 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Checkbox extends CheckboxBase implements CheckboxProps {\n constructor();\n}" + }, + "CallbackEvent": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CallbackEvent", + "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." + }, + "Chip": { + "filePath": "src/surfaces/admin/components.ts", + "name": "Chip", + "description": "", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "ColorKeyword", + "description": "Modify the color to be more or less intense.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Chip extends PreactCustomElement implements ChipProps {\n accessor color: ChipProps['color'];\n accessor accessibilityLabel: ChipProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Chip extends PolarisCustomElement implements ChipProps {\n color: ChipProps['color'];\n accessibilityLabel: ChipProps['accessibilityLabel'];\n removable: ChipProps['removable'];\n constructor(renderImpl?: Omit);\n}" }, "Choice": { "filePath": "src/surfaces/admin/components.ts", "name": "Choice", - "description": "The choice component creates individual selectable options within a choice list. Use choice to define each option that merchants can select, supporting both single selection (radio buttons) and multiple selection (checkboxes) modes.\n\nChoice components support labels, help text, and custom content through slots, providing flexible option presentation within choice lists.", - "isPublicDocs": true, + "description": "A single choice within a choice list that can be selected with a radio button or checkbox.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the choice is disabled and can't be selected.", "defaultValue": "false" }, { @@ -2004,7 +2208,7 @@ "syntaxKind": "GetAccessor", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the choice is currently selected.", "defaultValue": "false" }, { @@ -2012,21 +2216,21 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this choice is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, used when the visual label isn't descriptive enough." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the choice should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -2045,6 +2249,13 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -2074,7 +2285,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2082,24 +2293,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Choice extends PreactCustomElement implements ChoiceProps {\n accessor disabled: ChoiceProps['disabled'];\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n accessor value: ChoiceProps['value'];\n accessor accessibilityLabel: ChoiceProps['accessibilityLabel'];\n accessor defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Choice extends PolarisCustomElement implements ChoiceProps {\n /**\n * Whether the choice is disabled and can't be selected.\n */\n disabled: ChoiceProps['disabled'];\n /**\n * Whether the choice is currently selected.\n */\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n /**\n * The value that's submitted with the form when this choice is selected.\n */\n value: ChoiceProps['value'];\n /**\n * A label that's only visible to screen readers, used when the visual label isn't descriptive enough.\n */\n accessibilityLabel: ChoiceProps['accessibilityLabel'];\n /**\n * Whether the choice should be selected when it's first rendered.\n */\n defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ChoiceList": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceList", - "description": "Configure the following properties on the choice list component.", - "isPublicDocs": true, + "description": "A list of choices that lets users select one or more options using radio buttons or checkboxes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "addEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", + "description": "Wraps change and input event listeners so they only fire when the event was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n\nThis prevents form events from elements inside secondary content (e.g. TextField, native ) from being mistakenly treated as ChoiceList value-change events, while still allowing those events to bubble normally through the DOM (preserving React's event delegation).", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "removeEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction. When `true`, the `disabled` property on any child choices is ignored.", + "description": "Whether all choices in the list are disabled and can't be selected.", "defaultValue": "false" }, { @@ -2107,43 +2348,43 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name that identifies this choice list when the form is submitted." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the choice list when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the choice list." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "multiple", "value": "boolean", - "description": "Whether multiple choices can be selected.", + "description": "Whether users can select more than one choice at a time.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the choice list is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -2151,7 +2392,7 @@ "syntaxKind": "GetAccessor", "name": "values", "value": "string[]", - "description": "An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected." + "description": "The values of the currently selected choices." }, { "filePath": "src/surfaces/admin/components.ts", @@ -2180,11 +2421,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$3@11434", + "name": "__@internals$3@16769", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -2214,7 +2462,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2222,38 +2470,52 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ChoiceList extends BaseClass$3 implements ChoiceListProps {\n accessor disabled: ChoiceListProps['disabled'];\n accessor name: ChoiceListProps['name'];\n accessor error: ChoiceListProps['error'];\n accessor details: ChoiceListProps['details'];\n accessor multiple: ChoiceListProps['multiple'];\n accessor label: ChoiceListProps['label'];\n accessor labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class ChoiceList extends BaseClass$1 implements ChoiceListProps {\n /**\n * Wraps change and input event listeners so they only fire when the event\n * was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n *\n * This prevents form events from elements inside secondary content (e.g.\n * TextField, native ) from being mistakenly treated as ChoiceList\n * value-change events, while still allowing those events to bubble normally\n * through the DOM (preserving React's event delegation).\n * @private\n */\n addEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n\n /** @private */\n removeEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: EventListenerOptions | boolean,\n ): void;\n\n /**\n * Whether all choices in the list are disabled and can't be selected.\n */\n disabled: ChoiceListProps['disabled'];\n /**\n * The name that identifies this choice list when the form is submitted.\n */\n name: ChoiceListProps['name'];\n /**\n * An error message that's displayed below the choice list when validation fails.\n */\n error: ChoiceListProps['error'];\n /**\n * Additional text to provide context or guidance for the choice list.\n */\n details: ChoiceListProps['details'];\n /**\n * Whether users can select more than one choice at a time.\n */\n multiple: ChoiceListProps['multiple'];\n /**\n * The text that describes what the choice list is for.\n */\n label: ChoiceListProps['label'];\n /**\n * Controls whether the label is visible to all users or only to screen readers.\n */\n labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n /**\n * The values of the currently selected choices.\n */\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "Clickable": { "filePath": "src/surfaces/admin/components.ts", "name": "Clickable", - "description": "Configure the following properties on the clickable component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the component is disabled, preventing clicks and focus. When disabled, the `click` event won't fire and click events from child elements stop propagating immediately. Interactive child elements can still receive focus and be interacted with. This doesn't apply visual styling by default. You shouldapply disabled styling as needed." + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the component is in a loading state, which indicates to assistive technology that an action is in progress and prevents interaction." + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -2261,21 +2523,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "defaultValue": "'button'" }, { @@ -2283,7 +2545,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -2291,7 +2553,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -2299,7 +2561,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -2307,7 +2569,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -2315,7 +2577,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -2323,7 +2585,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -2331,7 +2593,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -2339,7 +2601,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -2347,7 +2609,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -2355,7 +2617,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -2363,7 +2625,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -2371,7 +2633,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -2379,7 +2641,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -2387,7 +2649,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -2395,7 +2657,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -2403,7 +2665,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -2411,7 +2673,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -2431,7 +2693,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -2439,7 +2701,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -2447,7 +2709,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -2455,7 +2717,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -2463,14 +2725,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -2478,141 +2740,15 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", - "defaultValue": "'--auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." - } - ], - "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n accessor disabled: ClickableProps['disabled'];\n accessor loading: ClickableProps['loading'];\n accessor target: ClickableProps['target'];\n accessor href: ClickableProps['href'];\n accessor download: ClickableProps['download'];\n accessor type: ClickableProps['type'];\n constructor();\n}" - }, - "ClickableChip": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ClickableChip", - "description": "Configure the following properties on the clickable chip component.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", - "defaultValue": "'base'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "removable", - "value": "boolean", - "description": "Whether the chip displays a remove button for dismissal. When clicked, the `remove` callback fires.", - "defaultValue": "false" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "hidden", - "value": "boolean", - "description": "Whether the chip is hidden from view. When using controlled component pattern with `removable` chips, update this property when the `remove` event fires. For non-removable chips, manually toggle this property to show or hide the chip.", - "defaultValue": "false" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the chip is disabled, preventing any user interaction.", - "defaultValue": "false" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "href", - "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -2659,7 +2795,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2667,15 +2803,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -2683,30 +2834,183 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class ClickableChip\n extends ClickableChip_base\n implements ClickableChipProps\n{\n accessor color: ClickableChipProps['color'];\n accessor accessibilityLabel: ClickableChipProps['accessibilityLabel'];\n accessor removable: ClickableChipProps['removable'];\n accessor hidden: ClickableChipProps['hidden'];\n accessor disabled: ClickableChipProps['disabled'];\n accessor href: ClickableChipProps['href'];\n constructor();\n}" + "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n disabled: ClickableProps['disabled'];\n loading: ClickableProps['loading'];\n target: ClickableProps['target'];\n href: ClickableProps['href'];\n download: ClickableProps['download'];\n type: ClickableProps['type'];\n constructor();\n}" + }, + "ClickableChip": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ClickableChip", + "description": "A custom element for displaying interactive chips that can be clicked or removed.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "ColorKeyword", + "description": "The color of the chip.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "accessibilityLabel", + "value": "string", + "description": "A text description of the chip for screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "removable", + "value": "boolean", + "description": "Whether the chip can be removed by the user.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "hidden", + "value": "boolean", + "description": "Whether the chip is hidden from view.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "disabled", + "value": "boolean", + "description": "Whether the chip is disabled and can't be clicked.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "href", + "value": "string", + "description": "The URL to navigate to when the chip is clicked." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle'", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", + "defaultValue": "'--auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "commandFor", + "value": "string", + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", + "value": "string", + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." + } + ], + "value": "declare class ClickableChip\n extends ClickableChipBase\n implements ClickableChipProps\n{\n /**\n * The color of the chip.\n */\n color: ClickableChipProps['color'];\n constructor();\n}" }, "ColorField": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorField", - "description": "Configure the following properties on the color field component.", - "isPublicDocs": true, + "description": "The color field custom element class that renders a color input field with integrated visual picker in the Shopify admin interface. This component allows merchants to select colors by typing hex values or using an interactive color picker, with optional support for transparency (alpha channel).", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -2714,7 +3018,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", @@ -2737,7 +3041,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\"", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -2745,35 +3049,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -2781,14 +3085,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -2796,7 +3100,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -2820,7 +3124,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -2836,7 +3140,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -2844,23 +3148,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -2898,7 +3209,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2906,24 +3217,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ColorField\n extends PreactFieldElement\n implements ColorFieldProps\n{\n accessor alpha: ColorFieldProps['alpha'];\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n setInternalValue(value: string, normalize: boolean): void;\n}" + "value": "declare class ColorField extends ColorFieldBase implements ColorFieldProps {\n constructor();\n}" }, "ColorPicker": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorPicker", - "description": "Configure the following properties on the color picker component.", - "isPublicDocs": true, + "description": "A visual color picker component that allows users to select colors from a color spectrum interface.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -2931,154 +3256,138 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial color value when the field first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts interacting, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", "name": "formResetCallback", "value": "() => void", - "description": "A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@internals$2@11535", - "value": "ElementInternals", "description": "", "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true } ], - "value": "declare class ColorPicker extends BaseClass$2 implements ColorPickerProps {\n accessor alpha: boolean;\n accessor name: string;\n accessor defaultValue: string;\n get value(): string;\n set value(value: string);\n /**\n * A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`.\n */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class ColorPicker extends BaseClass implements ColorPickerProps {\n /**\n * Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.\n *\n * @default false\n */\n alpha: boolean;\n /**\n * The name of the picker, used when submitting form data.\n */\n name: string;\n /**\n * The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n defaultValue: string;\n /**\n * The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n}" }, "DateField": { "filePath": "src/surfaces/admin/components.ts", "name": "DateField", - "description": "Configure the following properties on the date field component.", - "isPublicDocs": true, + "description": "The date field custom element class that renders a date input field with integrated calendar picker in the Shopify admin interface. This component allows merchants to select dates by typing or using a visual calendar, with support for date range restrictions and day-of-week constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar picker, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar picker first opens, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "DateAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -3086,36 +3395,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "defaultValue": "\"\"" + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -3123,14 +3431,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -3138,7 +3446,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -3162,7 +3470,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -3186,7 +3494,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -3194,31 +3502,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected date in `YYYY-MM-DD` format. An empty string means no date is selected.", - "defaultValue": "\"\"" + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -3256,7 +3570,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -3264,78 +3578,139 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DateField\n extends PreactFieldElement\n implements DateFieldProps\n{\n accessor allow: DateFieldProps['allow'];\n accessor disallow: DateFieldProps['disallow'];\n accessor allowDays: DateFieldProps['allowDays'];\n accessor disallowDays: DateFieldProps['disallowDays'];\n set view(view: string);\n get view(): string;\n accessor defaultView: DateFieldProps['defaultView'];\n constructor();\n}" + "value": "declare class DateField extends DateFieldBase implements DateFieldProps {\n constructor();\n}" }, "DateAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "DateAutocompleteField", "value": "'bday-day' | 'bday-month' | 'bday-year' | 'bday' | 'cc-expiry-month' | 'cc-expiry-year' | 'cc-expiry'", - "description": "Represents autocomplete values that are valid for date input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for date-based inputs.\n\nAvailable values:\n- `bday` - Complete birthday date\n- `bday-day` - Day component of a birthday (1-31)\n- `bday-month` - Month component of a birthday (1-12)\n- `bday-year` - Year component of a birthday (1990)\n- `cc-expiry` - Complete credit card expiration date\n- `cc-expiry-month` - Month component of a credit card expiration date (1-12)\n- `cc-expiry-year` - Year component of a credit card expiration date (2025)", - "isPublicDocs": true + "description": "" }, "DatePicker": { "filePath": "src/surfaces/admin/components.ts", "name": "DatePicker", - "description": "Configure the following properties on the date picker component.", - "isPublicDocs": true, + "description": "The date picker custom element class that renders a standalone calendar interface in the Shopify admin. This component allows merchants to select single dates or date ranges using an interactive calendar with month/year navigation, date constraints, and day-of-week restrictions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar first renders, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"single\" | \"range\"", - "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "description": "The type of date selection allowed. Available values: `single`, `range`.", "defaultValue": "\"single\"" }, { @@ -3343,7 +3718,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initially selected date(s) when the component first renders. An empty string means no date is initially selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The initial selected date or date range when the picker first renders, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -3351,14 +3726,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "value", "value": "string", - "description": "The currently selected date(s). An empty string means no date is selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The currently selected date or date range, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -3372,19 +3747,26 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@dirtyStateSymbol@11579", - "value": "boolean", + "name": "__@internals$1@16931", + "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$1@11578", - "value": "ElementInternals", + "name": "__@dirtyStateSymbol@16932", + "value": "boolean", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -3430,7 +3812,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -3438,17 +3820,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DatePicker extends BaseClass$1 implements DatePickerProps {\n accessor defaultView: string;\n set view(view: string);\n get view(): string;\n accessor allow: DatePickerProps['allow'];\n accessor disallow: DatePickerProps['disallow'];\n accessor allowDays: DatePickerProps['allowDays'];\n accessor disallowDays: DatePickerProps['disallowDays'];\n accessor type: DatePickerProps['type'];\n accessor defaultValue: DatePickerProps['defaultValue'];\n accessor name: DatePickerProps['name'];\n set value(value: string);\n get value(): string;\n /** @private */\n [dirtyStateSymbol]: boolean;\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DatePicker\n extends DatePickerBase\n implements DatePickerProps\n{\n constructor();\n}" }, "DropZone": { "filePath": "src/surfaces/admin/components.ts", "name": "DropZone", - "description": "Configure the following properties on the drop zone component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -3470,29 +3866,29 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -3508,14 +3904,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -3545,7 +3941,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@setFiles@11614", + "name": "__@setFiles@16968", "value": "(files: File[]) => void", "description": "", "isPrivate": true @@ -3553,7 +3949,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@getFileInput@11616", + "name": "__@getFileInput@16970", "value": "() => HTMLInputElement", "description": "", "isPrivate": true @@ -3561,11 +3957,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals@11615", + "name": "__@internals@16969", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -3611,7 +4014,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -3619,17 +4022,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DropZone extends BaseClass implements DropZoneProps {\n accessor accept: DropZoneProps['accept'];\n accessor accessibilityLabel: DropZoneProps['accessibilityLabel'];\n accessor disabled: DropZoneProps['disabled'];\n accessor error: DropZoneProps['error'];\n accessor label: DropZoneProps['label'];\n accessor labelAccessibilityVisibility: DropZoneProps['labelAccessibilityVisibility'];\n accessor multiple: DropZoneProps['multiple'];\n accessor name: DropZoneProps['name'];\n accessor required: DropZoneProps['required'];\n get value(): string;\n /** This sets the input value for a file type, which cannot be set programatically, so it can only be reset. */\n set value(value: '' | null);\n get files(): File[];\n set files(files: File[]);\n /** @private */\n [setFiles](files: File[]): void;\n /** @private */\n [getFileInput](): ReplaceType<\n Element | null | undefined,\n Element,\n HTMLInputElement\n >;\n\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DropZone extends DropZoneBase implements DropZoneProps {\n constructor();\n}" }, "Divider": { "filePath": "src/surfaces/admin/components.ts", "name": "Divider", - "description": "Configure the following properties on the divider component.", - "isPublicDocs": true, + "description": "A divider is a visual separator that creates a line between different sections of content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -3647,6 +4064,13 @@ "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -3692,7 +4116,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -3700,32 +4124,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Divider extends PreactCustomElement implements DividerProps {\n accessor direction: DividerProps['direction'];\n accessor color: DividerProps['color'];\n constructor();\n}" + "value": "declare class Divider extends PolarisCustomElement implements DividerProps {\n /**\n * The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n *\n * - `inline`: Horizontal divider for separating vertically stacked content\n * - `block`: Vertical divider for separating horizontally arranged content\n *\n * @default 'inline'\n */\n direction: DividerProps['direction'];\n /**\n * The visual prominence of the divider line.\n *\n * - `base`: Standard divider for most separations (default)\n * - `strong`: More prominent divider for major section breaks\n *\n * @default 'base'\n */\n color: DividerProps['color'];\n constructor();\n}" }, "EmailField": { "filePath": "src/surfaces/admin/components.ts", "name": "EmailField", - "description": "Configure the following properties on the email field component.", - "isPublicDocs": true, + "description": "The email field custom element class that renders an email input field in the Shopify admin interface. This component allows merchants to enter email addresses with automatic validation and optimized mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | EmailAutocompleteField | `section-${string} email` | `section-${string} home email` | `section-${string} mobile email` | `section-${string} fax email` | `section-${string} pager email` | \"shipping email\" | \"shipping home email\" | \"shipping mobile email\" | \"shipping fax email\" | \"shipping pager email\" | \"billing email\" | \"billing home email\" | \"billing mobile email\" | \"billing fax email\" | \"billing pager email\" | `section-${string} shipping email` | `section-${string} shipping home email` | `section-${string} shipping mobile email` | `section-${string} shipping fax email` | `section-${string} shipping pager email` | `section-${string} billing email` | `section-${string} billing home email` | `section-${string} billing mobile email` | `section-${string} billing fax email` | `section-${string} billing pager email`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint as to the intended content of the field for autocomplete purposes.", + "defaultValue": "'email'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -3733,50 +4171,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -3784,14 +4215,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -3799,7 +4230,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -3823,7 +4254,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -3847,7 +4278,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -3855,23 +4286,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -3909,7 +4354,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -3917,32 +4362,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class EmailField\n extends PreactFieldElement\n implements EmailFieldProps\n{\n accessor autocomplete: EmailFieldProps['autocomplete'];\n accessor maxLength: EmailFieldProps['maxLength'];\n accessor minLength: EmailFieldProps['minLength'];\n /**\n * The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class EmailField extends EmailFieldBase implements EmailFieldProps {\n constructor();\n}" }, "EmailAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "EmailAutocompleteField", "value": "'email' | 'home email' | 'mobile email' | 'fax email' | 'pager email'", - "description": "Represents autocomplete values that are valid for email input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for email inputs.\n\nAvailable values:\n- `email` - Primary email address\n- `home email` - Home email address\n- `mobile email` - Mobile device email address\n- `fax email` - Fax machine email address\n- `pager email` - Pager device email address", - "isPublicDocs": true + "description": "" }, "Grid": { "filePath": "src/surfaces/admin/components.ts", "name": "Grid", - "description": "Configure the following properties on the grid component.", - "isPublicDocs": true, + "description": "A grid is a layout component that arranges its children in rows and columns with precise control over sizing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridTemplateColumns", "value": "string", - "description": "The columns in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid columns.", "defaultValue": "'none'" }, { @@ -3950,7 +4408,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridTemplateRows", "value": "string", - "description": "The rows in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid rows.", "defaultValue": "'none'" }, { @@ -3958,7 +4416,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyItems", "value": "\"\" | JustifyItemsKeyword", - "description": "Aligns the grid items along the inline axis.", + "description": "The alignment of grid items along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -3966,7 +4424,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "\"\" | AlignItemsKeyword", - "description": "Aligns the grid items along the block axis.", + "description": "The alignment of grid items along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -3974,7 +4432,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeItems", "value": "AlignItemsKeyword | \"normal normal\" | \"normal stretch\" | \"normal baseline\" | \"normal first baseline\" | \"normal last baseline\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch baseline\" | \"stretch first baseline\" | \"stretch last baseline\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline baseline\" | \"baseline first baseline\" | \"baseline last baseline\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline baseline\" | \"first baseline first baseline\" | \"first baseline last baseline\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline baseline\" | \"last baseline first baseline\" | \"last baseline last baseline\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start baseline\" | \"start first baseline\" | \"start last baseline\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end baseline\" | \"end first baseline\" | \"end last baseline\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center baseline\" | \"center first baseline\" | \"center last baseline\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start baseline\" | \"unsafe start first baseline\" | \"unsafe start last baseline\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end baseline\" | \"unsafe end first baseline\" | \"unsafe end last baseline\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center baseline\" | \"unsafe center first baseline\" | \"unsafe center last baseline\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start baseline\" | \"safe start first baseline\" | \"safe start last baseline\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end baseline\" | \"safe end first baseline\" | \"safe end last baseline\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center baseline\" | \"safe center first baseline\" | \"safe center last baseline\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\"", - "description": "A shorthand property for `justify-items` and `align-items`.", + "description": "A shorthand for setting both `alignItems` and `justifyItems`.", "defaultValue": "'normal normal'" }, { @@ -3982,7 +4440,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "\"\" | JustifyContentKeyword", - "description": "Aligns the grid along the inline axis. This overrides the inline value of `placeContent`.", + "description": "The alignment of the grid along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -3990,7 +4448,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "\"\" | AlignContentKeyword", - "description": "Aligns the grid along the block axis. This overrides the block value of `placeContent`.", + "description": "The alignment of the grid along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -3998,7 +4456,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeContent", "value": "\"normal normal\" | \"normal stretch\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\" | AlignContentKeyword | \"normal space-between\" | \"normal space-around\" | \"normal space-evenly\" | \"baseline space-between\" | \"baseline space-around\" | \"baseline space-evenly\" | \"first baseline space-between\" | \"first baseline space-around\" | \"first baseline space-evenly\" | \"last baseline space-between\" | \"last baseline space-around\" | \"last baseline space-evenly\" | \"start space-between\" | \"start space-around\" | \"start space-evenly\" | \"end space-between\" | \"end space-around\" | \"end space-evenly\" | \"center space-between\" | \"center space-around\" | \"center space-evenly\" | \"unsafe start space-between\" | \"unsafe start space-around\" | \"unsafe start space-evenly\" | \"unsafe end space-between\" | \"unsafe end space-around\" | \"unsafe end space-evenly\" | \"unsafe center space-between\" | \"unsafe center space-around\" | \"unsafe center space-evenly\" | \"safe start space-between\" | \"safe start space-around\" | \"safe start space-evenly\" | \"safe end space-between\" | \"safe end space-around\" | \"safe end space-evenly\" | \"safe center space-between\" | \"safe center space-around\" | \"safe center space-evenly\" | \"stretch space-between\" | \"stretch space-around\" | \"stretch space-evenly\" | \"space-between normal\" | \"space-between start\" | \"space-between end\" | \"space-between center\" | \"space-between unsafe start\" | \"space-between unsafe end\" | \"space-between unsafe center\" | \"space-between safe start\" | \"space-between safe end\" | \"space-between safe center\" | \"space-between stretch\" | \"space-between space-between\" | \"space-between space-around\" | \"space-between space-evenly\" | \"space-around normal\" | \"space-around start\" | \"space-around end\" | \"space-around center\" | \"space-around unsafe start\" | \"space-around unsafe end\" | \"space-around unsafe center\" | \"space-around safe start\" | \"space-around safe end\" | \"space-around safe center\" | \"space-around stretch\" | \"space-around space-between\" | \"space-around space-around\" | \"space-around space-evenly\" | \"space-evenly normal\" | \"space-evenly start\" | \"space-evenly end\" | \"space-evenly center\" | \"space-evenly unsafe start\" | \"space-evenly unsafe end\" | \"space-evenly unsafe center\" | \"space-evenly safe start\" | \"space-evenly safe end\" | \"space-evenly safe center\" | \"space-evenly stretch\" | \"space-evenly space-between\" | \"space-evenly space-around\" | \"space-evenly space-evenly\"", - "description": "A shorthand property for `justify-content` and `align-content`.", + "description": "A shorthand for setting both `alignContent` and `justifyContent`.", "defaultValue": "'normal normal'" }, { @@ -4006,7 +4464,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows and columns.", "defaultValue": "'none'" }, { @@ -4014,7 +4472,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "s spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows.", "defaultValue": "'' - meaning no override" }, { @@ -4022,7 +4480,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid columns.", "defaultValue": "'' - meaning no override" }, { @@ -4030,7 +4488,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -4038,7 +4496,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -4046,7 +4504,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -4054,7 +4512,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -4062,7 +4520,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -4070,7 +4528,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -4078,7 +4536,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -4086,7 +4544,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -4094,7 +4552,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -4102,7 +4560,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -4110,7 +4568,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4118,7 +4576,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4126,7 +4584,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4134,7 +4592,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4142,7 +4600,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4150,7 +4608,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4158,7 +4616,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -4178,7 +4636,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -4186,7 +4644,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -4194,7 +4652,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -4202,7 +4660,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -4210,14 +4668,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -4225,9 +4683,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -4273,7 +4738,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -4281,96 +4746,101 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n accessor gridTemplateColumns: GridProps['gridTemplateColumns'];\n accessor gridTemplateRows: GridProps['gridTemplateRows'];\n accessor justifyItems: GridProps['justifyItems'];\n accessor alignItems: GridProps['alignItems'];\n accessor placeItems: GridProps['placeItems'];\n accessor justifyContent: GridProps['justifyContent'];\n accessor alignContent: GridProps['alignContent'];\n accessor placeContent: GridProps['placeContent'];\n accessor gap: GridProps['gap'];\n accessor rowGap: GridProps['rowGap'];\n accessor columnGap: GridProps['columnGap'];\n}" + "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n /**\n * The template that defines the grid columns.\n */\n gridTemplateColumns: GridProps['gridTemplateColumns'];\n /**\n * The template that defines the grid rows.\n */\n gridTemplateRows: GridProps['gridTemplateRows'];\n /**\n * The alignment of grid items along the inline axis.\n */\n justifyItems: GridProps['justifyItems'];\n /**\n * The alignment of grid items along the block axis.\n */\n alignItems: GridProps['alignItems'];\n /**\n * A shorthand for setting both `alignItems` and `justifyItems`.\n */\n placeItems: GridProps['placeItems'];\n /**\n * The alignment of the grid along the inline axis.\n */\n justifyContent: GridProps['justifyContent'];\n /**\n * The alignment of the grid along the block axis.\n */\n alignContent: GridProps['alignContent'];\n /**\n * A shorthand for setting both `alignContent` and `justifyContent`.\n */\n placeContent: GridProps['placeContent'];\n /**\n * The spacing between grid rows and columns.\n */\n gap: GridProps['gap'];\n /**\n * The spacing between grid rows.\n */\n rowGap: GridProps['rowGap'];\n /**\n * The spacing between grid columns.\n */\n columnGap: GridProps['columnGap'];\n}" }, "JustifyItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.\n\nLearn more about the [justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).", - "isPublicDocs": true + "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis." }, "BaselinePosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BaselinePosition", "value": "'baseline' | 'first baseline' | 'last baseline'", - "description": "Represents baseline alignment positions used to align items relative to their baselines.\n- `baseline`: Aligns to the baseline of the parent.\n- `first baseline`: Aligns to the first baseline of the parent.\n- `last baseline`: Aligns to the last baseline of the parent.", - "isPublicDocs": true + "description": "" }, "OverflowPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "OverflowPosition", "value": "`unsafe ${ContentPosition}` | `safe ${ContentPosition}`", - "description": "Represents content positioning with overflow behavior control. Use `safe` to prevent content from becoming inaccessible when it overflows, or `unsafe` to allow overflow regardless of accessibility.", - "isPublicDocs": true + "description": "" }, "ContentPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentPosition", "value": "'center' | 'start' | 'end'", - "description": "Defines the position of content along an axis.\n- `center`: Centers the content.\n- `start`: Aligns content to the start.\n- `end`: Aligns content to the end.", - "isPublicDocs": true + "description": "" }, "AlignItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Align items sets the align-self value on all direct children as a group.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isPublicDocs": true + "description": "Align items sets the align-self value on all direct children as a group." }, "JustifyContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyContentKeyword", "value": "'normal' | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", - "isPublicDocs": true + "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container." }, "ContentDistribution": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentDistribution", "value": "'space-between' | 'space-around' | 'space-evenly' | 'stretch'", - "description": "Defines how space is distributed between and around content items in flex and grid layouts.\n- `space-between`: Distributes items evenly with the first item at the start and last at the end.\n- `space-around`: Distributes items evenly with equal space around each item.\n- `space-evenly`: Distributes items evenly with equal space between them.\n- `stretch`: Stretches items to fill the container.", - "isPublicDocs": true + "description": "" }, "AlignContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignContentKeyword", "value": "'normal' | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isPublicDocs": true + "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis." }, "SpacingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SpacingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the spacing size between elements, using the standard size scale or `none` for no spacing.", - "isPublicDocs": true + "description": "" }, "GridItem": { "filePath": "src/surfaces/admin/components.ts", "name": "GridItem", - "description": "The grid item component represents a single cell within a grid layout, allowing you to control how content is positioned and sized within the grid. Use grid item as a child of grid to specify column span, row span, and positioning for individual content areas.\n\nGrid item supports precise placement control through column and row properties, enabling you to create complex layouts where different items occupy varying amounts of space or appear in specific grid positions.", - "isPublicDocs": true, + "description": "A grid item is a child of a grid that can be positioned within specific rows and columns.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridColumn", "value": "\"auto\" | `span ${number}`", - "description": "The number of columns the item will span across.\n\nLearn more about the [grid-column property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).", + "description": "The column position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -4378,7 +4848,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridRow", "value": "\"auto\" | `span ${number}`", - "description": "The number of rows the item will span across.\n\nLearn more about the [grid-row property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).", + "description": "The row position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -4386,7 +4856,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -4394,7 +4864,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -4402,7 +4872,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -4410,7 +4880,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -4418,7 +4888,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -4426,7 +4896,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -4434,7 +4904,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -4442,7 +4912,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -4450,7 +4920,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -4458,7 +4928,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -4466,7 +4936,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4474,7 +4944,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4482,7 +4952,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4490,7 +4960,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4498,7 +4968,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4506,7 +4976,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4514,7 +4984,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -4534,7 +5004,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -4542,7 +5012,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -4550,7 +5020,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -4558,7 +5028,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -4566,14 +5036,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -4581,9 +5051,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -4629,7 +5106,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -4637,24 +5114,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class GridItem extends BoxElement implements GridItemProps {\n accessor gridColumn: GridItemProps['gridColumn'];\n accessor gridRow: GridItemProps['gridRow'];\n constructor();\n}" + "value": "declare class GridItem extends BoxElement implements GridItemProps {\n /**\n * The column position and span of the grid item.\n */\n gridColumn: GridItemProps['gridColumn'];\n /**\n * The row position and span of the grid item.\n */\n gridRow: GridItemProps['gridRow'];\n constructor();\n}" }, "Heading": { "filePath": "src/surfaces/admin/components.ts", "name": "Heading", - "description": "Configure the following properties on the heading component.", - "isPublicDocs": true, + "description": "A custom element for displaying hierarchical section titles and headings with appropriate semantic meaning and visual styling. Use Heading to structure your content with proper heading levels for both visual hierarchy and accessibility.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"heading\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The ARIA role for the heading. Set to `'heading'` (the default) for standard heading semantics, or `'presentation'` / `'none'` to remove heading semantics for decorative use.", "defaultValue": "'heading'" }, { @@ -4662,7 +5153,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lineClamp", "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", "defaultValue": "Infinity - no truncation is applied" }, { @@ -4670,9 +5161,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -4718,7 +5216,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -4726,47 +5224,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Heading extends PreactCustomElement implements HeadingProps {\n accessor accessibilityRole: HeadingProps['accessibilityRole'];\n accessor lineClamp: HeadingProps['lineClamp'];\n accessor accessibilityVisibility: HeadingProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Heading extends HeadingBase implements HeadingProps {\n constructor();\n}" }, "Icon": { "filePath": "src/surfaces/admin/components.ts", "name": "Icon", - "description": "Configure the following properties on the icon component.", - "isPublicDocs": true, + "description": "An icon displays a graphical symbol from the icon library.", "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", + "description": "The color tone of the icon based on its semantic meaning.", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "The icon to display from the icon library.\n\nSet to a valid icon name to display that icon. To hide the icon completely, use an empty string `''`. To reserve the icon's space without displaying an icon, use `'empty'`." + "value": "\"\" | IconType", + "description": "The type of icon to display." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color emphasis of the icon.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"base\"", - "description": "The size of the icon.\n\n- `small`: Smaller icon suitable for inline use within text or compact UI elements.\n- `base`: Default size that works well for standalone icons and standard use cases.", + "description": "The size of the icon.", "defaultValue": "'base'" }, { @@ -4774,7 +5286,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The element that this icon should show interest for when activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -4821,7 +5340,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -4829,53 +5348,67 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Icon extends PreactCustomElement implements IconProps {\n accessor color: IconProps['color'];\n accessor tone: IconProps['tone'];\n accessor type: IconProps['type'];\n accessor size: IconProps['size'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Icon extends IconBase implements IconProps {\n /**\n * The color tone of the icon based on its semantic meaning.\n */\n tone: IconProps['tone'];\n /**\n * The type of icon to display.\n */\n type: IconProps['type'];\n constructor();\n}" }, "Image": { "filePath": "src/surfaces/admin/components.ts", "name": "Image", - "description": "Configure the following properties on the image component.", - "isPublicDocs": true, + "description": "An image displays pictures with configurable sizing, loading behavior, and borders.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "srcSet", "value": "string", - "description": "A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n\nLearn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset)." + "description": "A set of source images with different sizes for responsive loading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "sizes", "value": "string", - "description": "A set of media conditions and their corresponding sizes.\n\nLearn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes)." + "description": "The sizes of the image at different viewport widths." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "aspectRatio", "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", - "description": "The aspect ratio of the image.\n\nThe rendering of the image will depend on the `inlineSize` value:\n\n- `inlineSize=\"fill\"`: the aspect ratio will be respected and the image will take the necessary space.\n- `inlineSize=\"auto\"`: the image will not render until it has loaded and the aspect ratio will be ignored.\n\nFor example, if the value is set as `50 / 100`, the getter returns `50 / 100`. If the value is set as `0.5`, the getter returns `0.5 / 1`.\n\nLearn more about the [aspect-ratio property](https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio).", + "description": "The aspect ratio of the image as a width-to-height ratio.", "defaultValue": "'1/1'" }, { @@ -4883,7 +5416,7 @@ "syntaxKind": "PropertyDeclaration", "name": "objectFit", "value": "\"contain\" | \"cover\"", - "description": "The image resizing behavior to fit within its container.\n\n- `contain`: Scales the image to fit within the container while maintaining its aspect ratio. The entire image is visible, but might leave empty space.\n- `cover`: Scales the image to fill the entire container while maintaining its aspect ratio. The image might be cropped to fit.\n\nThe image is always positioned in the center of the container.\n\nLearn more about the [object-fit property](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).", + "description": "How the image should be resized to fit its container.", "defaultValue": "'contain'" }, { @@ -4891,7 +5424,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "\"eager\" | \"lazy\"", - "description": "The loading strategy for the image.\n\n- `eager`: Immediately loads the image, irrespective of its position within the visible viewport.\n- `lazy`: Delays loading the image until it approaches a specified distance from the viewport.\n\nLearn more about the [loading attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading).", + "description": "When the image should be loaded.", "defaultValue": "'eager'" }, { @@ -4899,7 +5432,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"img\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The accessibility role for the image.", "defaultValue": "'img'" }, { @@ -4907,7 +5440,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "\"auto\" | \"fill\"", - "description": "The displayed inline width of the image.\n\n- `fill`: the image will takes up 100% of the available inline size.\n- `auto`: the image will be displayed at its natural size.\n\nLearn more about the [width attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#width).", + "description": "The inline size (width in horizontal writing modes) of the image.", "defaultValue": "'fill'" }, { @@ -4915,35 +5448,23 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied around the image using shorthand syntax to specify width, color, and style in a single property.", - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "description": "Whether to show a border around the image.", + "defaultValue": "'none' - equivalent to `none base auto`." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderWidth", - "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderStyle", - "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image.", "defaultValue": "'' - meaning no override" }, { @@ -4951,17 +5472,161 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "The color of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the image's corners using the design system's radius scale.", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image.", "defaultValue": "'none'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Image extends PolarisCustomElement implements ImageProps {\n /**\n * The URL of the image to display.\n */\n src: ImageProps['src'];\n /**\n * A set of source images with different sizes for responsive loading.\n */\n srcSet: ImageProps['srcSet'];\n /**\n * The sizes of the image at different viewport widths.\n */\n sizes: ImageProps['sizes'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ImageProps['alt'];\n /**\n * The aspect ratio of the image as a width-to-height ratio.\n */\n aspectRatio: ImageProps['aspectRatio'];\n /**\n * How the image should be resized to fit its container.\n */\n objectFit: ImageProps['objectFit'];\n /**\n * When the image should be loaded.\n */\n loading: ImageProps['loading'];\n /**\n * The accessibility role for the image.\n */\n accessibilityRole: ImageProps['accessibilityRole'];\n /**\n * The inline size (width in horizontal writing modes) of the image.\n */\n inlineSize: ImageProps['inlineSize'];\n /**\n * Whether to show a border around the image.\n */\n border: ImageProps['border'];\n /**\n * The width of the border around the image.\n */\n borderWidth: ImageProps['borderWidth'];\n /**\n * The style of the border around the image.\n */\n borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image.\n */\n borderColor: ImageProps['borderColor'];\n /**\n * The radius of the border corners around the image.\n */\n borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + }, + "BorderRadiusKeyword": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "BorderRadiusKeyword", + "value": "SizeKeyword | 'max' | 'none'", + "description": "" + }, + "Link": { + "filePath": "src/surfaces/admin/components.ts", + "name": "Link", + "description": "", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "target", + "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", + "description": "Specifies where to display the linked URL.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -5007,7 +5672,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5015,124 +5680,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Image extends PreactCustomElement implements ImageProps {\n accessor src: ImageProps['src'];\n accessor srcSet: ImageProps['srcSet'];\n accessor sizes: ImageProps['sizes'];\n accessor alt: ImageProps['alt'];\n accessor aspectRatio: ImageProps['aspectRatio'];\n accessor objectFit: ImageProps['objectFit'];\n accessor loading: ImageProps['loading'];\n accessor accessibilityRole: ImageProps['accessibilityRole'];\n accessor inlineSize: ImageProps['inlineSize'];\n /**\n * A border applied around the image using shorthand syntax to specify width, color, and style in a single property.\n */\n accessor border: ImageProps['border'];\n /**\n * The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.\n */\n accessor borderWidth: ImageProps['borderWidth'];\n /**\n * The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.\n */\n accessor borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.\n */\n accessor borderColor: ImageProps['borderColor'];\n /**\n * The roundedness of the image's corners using the design system's radius scale.\n */\n accessor borderRadius: ImageProps['borderRadius'];\n constructor();\n}" - }, - "Link": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Link", - "description": "Configure the following properties on the link component.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "href", - "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "target", - "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", - "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "download", - "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "lang", - "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", + "name": "__@flushRenderSymbol@16092", "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -5140,24 +5711,30 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Link extends Link_base implements LinkProps {\n accessor tone: LinkProps['tone'];\n accessor accessibilityLabel: LinkProps['accessibilityLabel'];\n accessor href: LinkProps['href'];\n accessor target: LinkProps['target'];\n accessor download: LinkProps['download'];\n accessor lang: LinkProps['lang'];\n constructor();\n}" + "value": "declare class Link extends LinkBase implements LinkProps {\n tone: LinkProps['tone'];\n constructor();\n}" }, "ListItem": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItem", - "description": "The list item component represents a single entry within an ordered list or unordered list. Use list item to structure individual points, steps, or items within a list, with each item automatically receiving appropriate list markers (bullets or numbers) from its parent list.\n\nList item must be used as a direct child of ordered list or unordered list components. Each list item can contain text, inline formatting, or other components to create rich list content.", - "isPublicDocs": true, + "description": "A component that represents a single item within an ordered list or unordered list.\n\nUse list item as a child of ordered list or unordered list to create properly structured and accessible list content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -5203,7 +5780,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5211,24 +5788,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ListItem extends PreactCustomElement implements ListItemProps {\n constructor();\n}" + "value": "declare class ListItem extends PolarisCustomElement implements ListItemProps {\n constructor();\n}" }, "Menu": { "filePath": "src/surfaces/admin/components.ts", "name": "Menu", - "description": "Configure the following properties on the menu component.", - "isPublicDocs": true, + "description": "A component that displays a contextual list of actions or options, which is typically triggered by a button or other activator element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the menu for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", @@ -5249,7 +5840,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -5257,7 +5848,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -5265,11 +5856,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -5299,7 +5897,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5307,24 +5905,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n accessor accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n /**\n * A label that describes the menu for assistive technologies.\n */\n accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "MoneyField": { "filePath": "src/surfaces/admin/components.ts", "name": "MoneyField", - "description": "Configure the following properties on the money field component.", - "isPublicDocs": true, + "description": "The money field custom element class that renders a monetary input field in the Shopify admin interface. This component allows merchants to enter currency amounts with automatic formatting, decimal precision, and validation against minimum and maximum values.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum monetary value allowed in the field.", "defaultValue": "Infinity" }, { @@ -5332,9 +5944,17 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum monetary value allowed in the field.", "defaultValue": "-Infinity" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "currencyCode", + "value": "\"auto\" | CurrencyCode", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -5347,7 +5967,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "string", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -5355,35 +5975,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -5391,14 +6011,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -5406,7 +6026,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -5430,7 +6050,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -5454,7 +6074,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -5462,23 +6082,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -5516,7 +6143,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5524,17 +6151,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class MoneyField\n extends PreactFieldElement\n implements MoneyFieldProps\n{\n accessor max: MoneyFieldProps['max'];\n accessor min: MoneyFieldProps['min'];\n /**\n * The current monetary value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string representing the amount in the store's currency.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class MoneyField extends MoneyFieldBase implements MoneyFieldProps {\n constructor();\n}" + }, + "CurrencyCode": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CurrencyCode", + "value": "'USD' | 'EUR' | 'GBP' | 'CAD' | 'AFN' | 'ALL' | 'DZD' | 'AOA' | 'ARS' | 'AMD' | 'AWG' | 'AUD' | 'BBD' | 'AZN' | 'BDT' | 'BSD' | 'BHD' | 'BIF' | 'BZD' | 'BMD' | 'BTN' | 'BAM' | 'BRL' | 'BOB' | 'BWP' | 'BND' | 'BGN' | 'MMK' | 'KHR' | 'CVE' | 'KYD' | 'XAF' | 'CLP' | 'CNY' | 'COP' | 'KMF' | 'CDF' | 'CRC' | 'HRK' | 'CZK' | 'DKK' | 'DOP' | 'XCD' | 'EGP' | 'ETB' | 'XPF' | 'FJD' | 'GMD' | 'GHS' | 'GTQ' | 'GYD' | 'GEL' | 'HTG' | 'HNL' | 'HKD' | 'HUF' | 'ISK' | 'INR' | 'IDR' | 'ILS' | 'IQD' | 'JMD' | 'JPY' | 'JEP' | 'JOD' | 'KZT' | 'KES' | 'KWD' | 'KGS' | 'LAK' | 'LVL' | 'LBP' | 'LSL' | 'LRD' | 'LTL' | 'MGA' | 'MKD' | 'MOP' | 'MWK' | 'MVR' | 'MXN' | 'MYR' | 'MUR' | 'MDL' | 'MAD' | 'MNT' | 'MZN' | 'NAD' | 'NPR' | 'ANG' | 'NZD' | 'NIO' | 'NGN' | 'NOK' | 'OMR' | 'PAB' | 'PKR' | 'PGK' | 'PYG' | 'PEN' | 'PHP' | 'PLN' | 'QAR' | 'RON' | 'RUB' | 'RWF' | 'WST' | 'SAR' | 'RSD' | 'SCR' | 'SGD' | 'SDG' | 'SYP' | 'ZAR' | 'KRW' | 'SSP' | 'SBD' | 'LKR' | 'SRD' | 'SZL' | 'SEK' | 'CHF' | 'TWD' | 'THB' | 'TZS' | 'TTD' | 'TND' | 'TRY' | 'TMT' | 'UGX' | 'UAH' | 'AED' | 'UYU' | 'UZS' | 'VUV' | 'VND' | 'XOF' | 'YER' | 'ZMW' | 'BYN' | 'BYR' | 'DJF' | 'ERN' | 'FKP' | 'GIP' | 'GNF' | 'IRR' | 'KID' | 'LYD' | 'MRU' | 'SLL' | 'SHP' | 'SOS' | 'STD' | 'STN' | 'TJS' | 'TOP' | 'VED' | 'VEF' | 'VES' | 'XXX'", + "description": "" }, "NumberField": { "filePath": "src/surfaces/admin/components.ts", "name": "NumberField", - "description": "Configure the following properties on the number field component.", - "isPublicDocs": true, + "description": "The number field custom element class that renders a numeric input field in the Shopify admin interface. This component allows merchants to enter numbers with automatic validation and prefix/suffix display.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -5548,7 +6196,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inputMode", "value": "\"decimal\" | \"numeric\"", - "description": "The type of virtual keyboard to display on mobile devices.\n\n- `decimal`: Shows a numeric keyboard with a decimal point, suitable for prices or measurements.\n- `numeric`: Shows a numeric keyboard without a decimal point, suitable for whole numbers like quantities.\n\nLearn more about the [inputmode attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode).", + "description": "The input mode hint for mobile keyboards. Available values include:\n- `numeric`: Shows a numeric keypad optimized for entering numbers\n- `decimal`: Shows a numeric keypad with decimal point support\n- `tel`: Shows a telephone keypad", "defaultValue": "'decimal'" }, { @@ -5556,7 +6204,7 @@ "syntaxKind": "PropertyDeclaration", "name": "step", "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "description": "The granularity that the value must adhere to, or the keyword `any`. This controls the increment/decrement step size.", "defaultValue": "1" }, { @@ -5564,7 +6212,7 @@ "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum numeric value allowed in the field.", "defaultValue": "Infinity" }, { @@ -5572,7 +6220,7 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum numeric value allowed in the field.", "defaultValue": "-Infinity" }, { @@ -5580,7 +6228,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the user's input, such as a currency symbol.", "defaultValue": "''" }, { @@ -5588,7 +6236,7 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the user's input, such as a unit of measurement.", "defaultValue": "''" }, { @@ -5596,7 +6244,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | NumberAutocompleteField | `section-${string} one-time-code` | `section-${string} cc-number` | `section-${string} cc-csc` | \"shipping one-time-code\" | \"shipping cc-number\" | \"shipping cc-csc\" | \"billing one-time-code\" | \"billing cc-number\" | \"billing cc-csc\" | `section-${string} shipping one-time-code` | `section-${string} shipping cc-number` | `section-${string} shipping cc-csc` | `section-${string} billing one-time-code` | `section-${string} billing cc-number` | `section-${string} billing cc-csc`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -5604,35 +6252,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -5640,14 +6288,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -5655,7 +6303,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -5679,7 +6327,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -5703,7 +6351,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -5711,23 +6359,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -5765,7 +6420,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5773,32 +6428,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class NumberField\n extends PreactFieldElement\n implements NumberFieldProps\n{\n /**\n * The current numeric value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string (decimal or integer).\n */\n get value(): string;\n set value(value: string);\n accessor inputMode: NumberFieldProps['inputMode'];\n accessor step: NumberFieldProps['step'];\n accessor max: NumberFieldProps['max'];\n accessor min: NumberFieldProps['min'];\n accessor prefix: NumberFieldProps['prefix'];\n accessor suffix: NumberFieldProps['suffix'];\n constructor();\n}" + "value": "declare class NumberField extends NumberFieldBase implements NumberFieldProps {\n constructor();\n}" }, "NumberAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "NumberAutocompleteField", "value": "'one-time-code' | 'cc-number' | 'cc-csc'", - "description": "Represents autocomplete values that are valid for number input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for numeric inputs.\n\nAvailable values:\n- `one-time-code` - One-time codes for authentication (OTP, 2FA codes)\n- `cc-number` - Credit card number\n- `cc-csc` - Credit card security code (CVV/CVC)", - "isPublicDocs": true + "description": "" }, "Option": { "filePath": "src/surfaces/admin/components.ts", "name": "Option", - "description": "Represents a single option within a select component. Use only as a child of s-select components.", - "isPublicDocs": true, + "description": "A single option within a select dropdown that users can choose.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the option is currently selected.", "defaultValue": "false" }, { @@ -5806,7 +6474,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the option should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -5814,16 +6482,124 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this option is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the option is disabled and can't be selected.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Option extends PolarisCustomElement implements OptionProps {\n /**\n * Whether the option is currently selected.\n */\n selected: OptionProps['selected'];\n /**\n * Whether the option should be selected when it's first rendered.\n */\n defaultSelected: OptionProps['defaultSelected'];\n /**\n * The value that's submitted with the form when this option is selected.\n */\n value: OptionProps['value'];\n /**\n * Whether the option is disabled and can't be selected.\n */\n disabled: OptionProps['disabled'];\n constructor();\n}" + }, + "OptionGroup": { + "filePath": "src/surfaces/admin/components.ts", + "name": "OptionGroup", + "description": "A group of related options within a select dropdown, displayed with a label.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "disabled", + "value": "boolean", + "description": "Whether all options in the group are disabled and can't be selected.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "label", + "value": "string", + "description": "The text that describes what this group of options represents." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -5869,7 +6645,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5877,98 +6653,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Option extends PreactCustomElement implements OptionProps {\n accessor selected: OptionProps['selected'];\n accessor defaultSelected: OptionProps['defaultSelected'];\n accessor value: OptionProps['value'];\n accessor disabled: OptionProps['disabled'];\n constructor();\n}" - }, - "OptionGroup": { - "filePath": "src/surfaces/admin/components.ts", - "name": "OptionGroup", - "description": "Represents a group of options within a select component. Use only as a child of `s-select` components.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the options within this group can be selected or not.", - "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "label", - "value": "string", - "description": "The user-facing label for this group of options." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", + "name": "__@flushRenderSymbol@16092", "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OptionGroup\n extends PreactCustomElement\n implements OptionGroupProps\n{\n accessor disabled: OptionGroupProps['disabled'];\n accessor label: OptionGroupProps['label'];\n constructor();\n}" + "value": "declare class OptionGroup\n extends PolarisCustomElement\n implements OptionGroupProps\n{\n /**\n * Whether all options in the group are disabled and can't be selected.\n */\n disabled: OptionGroupProps['disabled'];\n /**\n * The text that describes what this group of options represents.\n */\n label: OptionGroupProps['label'];\n constructor();\n}" }, "OrderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "OrderedList", - "description": "Configure the following properties on the ordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a numbered list of items with automatic numbering and proper list semantics. Use ordered list when the sequence or order of items matters, such as instructions, rankings, or step-by-step processes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6014,7 +6731,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6022,48 +6739,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OrderedList\n extends PreactCustomElement\n implements OrderedListProps\n{\n constructor();\n}" + "value": "declare class OrderedList\n extends PolarisCustomElement\n implements OrderedListProps\n{\n constructor();\n}" }, "Paragraph": { "filePath": "src/surfaces/admin/components.ts", "name": "Paragraph", - "description": "Configure the following properties on the paragraph component.", - "isPublicDocs": true, + "description": "A custom element for displaying blocks of text content with consistent spacing and styling for readable body copy. Use Paragraph to render longer text content with proper line height and spacing between paragraphs.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "lineClamp", - "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", - "defaultValue": "Infinity - no truncation is applied" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the paragraph text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"caution\"", - "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "lineClamp", + "value": "number", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", + "defaultValue": "Infinity - no truncation is applied" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color of the paragraph text.", "defaultValue": "'base'" }, { @@ -6071,7 +6802,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -6079,9 +6810,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6127,7 +6865,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6135,24 +6873,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Paragraph extends PreactCustomElement implements ParagraphProps {\n accessor fontVariantNumeric: ParagraphProps['fontVariantNumeric'];\n accessor lineClamp: ParagraphProps['lineClamp'];\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: ParagraphProps['tone'];\n\n accessor color: ParagraphProps['color'];\n accessor dir: ParagraphProps['dir'];\n accessor accessibilityVisibility: ParagraphProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Paragraph extends ParagraphBase implements ParagraphProps {\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: ParagraphProps['tone'];\n constructor();\n}" }, "PasswordField": { "filePath": "src/surfaces/admin/components.ts", "name": "PasswordField", - "description": "Configure the following properties on the password field component.", - "isPublicDocs": true, + "description": "The password field custom element class that renders a password input field in the Shopify admin interface. This component allows merchants to enter passwords securely with characters automatically masked for privacy.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the password.", "defaultValue": "Infinity" }, { @@ -6160,22 +6912,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the password.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | PasswordAutocompleteField | `section-${string} current-password` | `section-${string} new-password` | \"shipping current-password\" | \"shipping new-password\" | \"billing current-password\" | \"billing new-password\" | `section-${string} shipping current-password` | `section-${string} shipping new-password` | `section-${string} billing current-password` | `section-${string} billing new-password`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -6183,35 +6928,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -6219,14 +6964,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -6234,7 +6979,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -6258,7 +7003,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -6282,7 +7027,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -6290,23 +7035,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6344,7 +7103,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6352,34 +7111,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class PasswordField\n extends PreactFieldElement\n implements PasswordFieldProps\n{\n accessor maxLength: PasswordFieldProps['maxLength'];\n accessor minLength: PasswordFieldProps['minLength'];\n /**\n * The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class PasswordField\n extends PasswordFieldBase\n implements PasswordFieldProps\n{\n constructor();\n}" }, "PasswordAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PasswordAutocompleteField", "value": "'current-password' | 'new-password'", - "description": "Represents autocomplete values that are valid for password input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for password inputs.\n\nAvailable values:\n- `current-password` - Existing password for login or authentication\n- `new-password` - New password when creating an account or changing password", - "isPublicDocs": true + "description": "" }, "QueryContainer": { "filePath": "src/surfaces/admin/components.ts", "name": "QueryContainer", - "description": "Configure the following properties on the query container component.", - "isPublicDocs": true, + "description": "A component that sets up a container query context, which lets child elements style themselves based on the container's size instead of the viewport size.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "containerName", "value": "string", - "description": "An identifier for this container that you can reference in CSS container queries to apply styles based on this specific container's size.\n\nAll query container components automatically receive a container name of `s-default`. You can omit the container name in your queries, so `@container (inline-size <= 300px)` is equivalent to `@container s-default (inline-size <= 300px)`.\n\nWhen you provide a custom `containerName`, it's added alongside `s-default`. For example, `containerName=\"product-card\"` results in `s-default product-card` being set on the `container-name` CSS property, allowing you to target this container with `@container product-card (inline-size <= 300px)`.\n\nLearn more about the [container-name property](https://developer.mozilla.org/en-US/docs/Web/CSS/container-name).", + "description": "The name of the container, which you can reference in CSS container queries.", "defaultValue": "''" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6425,7 +7204,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6433,24 +7212,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class QueryContainer\n extends PreactCustomElement\n implements QueryContainerProps\n{\n accessor containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" + "value": "declare class QueryContainer\n extends PolarisCustomElement\n implements QueryContainerProps\n{\n /**\n * The name of the container, which you can reference in CSS container queries.\n */\n containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" }, "SearchField": { "filePath": "src/surfaces/admin/components.ts", "name": "SearchField", - "description": "Configure the following properties on the search field component.", - "isPublicDocs": true, + "description": "A search field that lets users enter search queries with a search-specific input type.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters that can be entered in the field.", "defaultValue": "Infinity" }, { @@ -6458,22 +7251,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters that must be entered for the field to be valid.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -6481,35 +7267,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -6517,14 +7303,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -6532,7 +7318,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -6556,7 +7342,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -6580,7 +7366,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -6588,23 +7374,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6642,7 +7442,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6650,25 +7450,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class SearchField\n extends PreactFieldElement\n implements SearchFieldProps\n{\n accessor maxLength: SearchFieldProps['maxLength'];\n accessor minLength: SearchFieldProps['minLength'];\n /**\n * The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class SearchField extends SearchFieldBase implements SearchFieldProps {\n constructor();\n}" }, "TextAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" }, "Section": { "filePath": "src/surfaces/admin/components.ts", "name": "Section", - "description": "Configure the following properties on the section component.", - "isPublicDocs": true, + "description": "A section is a container that groups related content together with an optional heading.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -6678,28 +7491,43 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "The accessibility label for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The heading text displayed at the top of the section. This heading provides a title for the section's content and automatically uses the appropriate semantic heading level (h2, h3, h4) based on nesting depth to maintain proper document structure." + "description": "The heading text for the section." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "\"base\" | \"none\"", - "description": "The padding applied to all edges of the element.\n\n- `base`: applies padding that is appropriate for the element. Note that it might result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the section need to span to the edge of the section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "description": "Whether the section has padding.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6716,14 +7544,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6737,7 +7557,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6745,59 +7565,73 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Section extends PreactCustomElement implements SectionProps {\n constructor();\n /** @private */\n connectedCallback(): void;\n accessor accessibilityLabel: SectionProps['accessibilityLabel'];\n accessor heading: SectionProps['heading'];\n accessor padding: SectionProps['padding'];\n}" + "value": "declare class Section extends SectionBase implements SectionProps {\n constructor();\n}" }, "Select": { "filePath": "src/surfaces/admin/components.ts", "name": "Select", - "description": "Configure the following properties on the select component.", - "isPublicDocs": true, + "description": "A select dropdown that lets users choose one option from a list.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier." + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the select." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the select when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the select is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "Text that appears in the select when no option is selected to provide a hint about what to choose." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether an option must be selected before the form can be submitted.", "defaultValue": "false" }, { @@ -6805,7 +7639,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -6829,7 +7663,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component." + "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected Option component." }, { "filePath": "src/surfaces/admin/components.ts", @@ -6842,15 +7676,15 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@usedFirstOptionSymbol@12029", + "name": "__@usedFirstOptionSymbol@17470", "value": "boolean", - "description": "A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n\nThis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.", + "description": "used to determine if no value or defaultValue was set, in which case the first non-disabled option was used\n\nthis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@hasInitialValueSymbol@12030", + "name": "__@hasInitialValueSymbol@17471", "value": "boolean", "description": "", "isPrivate": true @@ -6860,7 +7694,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -6868,23 +7702,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6914,7 +7755,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6922,33 +7763,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Select extends PreactInputElement implements SelectProps {\n accessor icon: SelectProps['icon'];\n accessor details: SelectProps['details'];\n accessor error: SelectProps['error'];\n accessor label: SelectProps['label'];\n accessor placeholder: SelectProps['placeholder'];\n accessor required: SelectProps['required'];\n accessor labelAccessibilityVisibility: SelectProps['labelAccessibilityVisibility'];\n /** @private */\n connectedCallback(): void;\n /**\n * A lifecycle callback that fires when the component is removed from the DOM. Performs cleanup operations.\n * @private\n */\n disconnectedCallback(): void;\n constructor();\n /**\n * A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n *\n * This is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.\n * @private\n */\n [usedFirstOptionSymbol]: boolean;\n /**\n * @private\n */\n [hasInitialValueSymbol]: boolean;\n /**\n * The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component.\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n}" + "value": "declare class Select extends SelectBase implements SelectProps {\n constructor();\n}" }, "Spinner": { "filePath": "src/surfaces/admin/components.ts", "name": "Spinner", - "description": "Configure the following properties on the spinner component.", - "isPublicDocs": true, + "description": "A component that displays an animated loading indicator to show that content is currently being processed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the spinner for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the loading spinner.\n\n- `base`: Default size suitable for inline loading indicators or standard UI contexts.\n- `large`: Larger spinner for more prominent loading states.\n- `large-100`: Extra large spinner for full-page or emphasized loading states.", + "description": "The size of the spinner.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6994,7 +7856,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7002,24 +7864,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Spinner extends PreactCustomElement implements SpinnerProps {\n accessor accessibilityLabel: string;\n accessor size: SpinnerProps['size'];\n constructor();\n}" + "value": "declare class Spinner extends PolarisCustomElement implements SpinnerProps {\n /**\n * A label that describes the spinner for assistive technologies.\n */\n accessibilityLabel: string;\n /**\n * The size of the spinner.\n */\n size: SpinnerProps['size'];\n constructor();\n}" }, "Stack": { "filePath": "src/surfaces/admin/components.ts", "name": "Stack", - "description": "Configure the following properties on the stack component.", - "isPublicDocs": true, + "description": "A stack is a layout component that arranges its children in a single direction with controlled spacing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "direction", "value": "MaybeResponsive<\"inline\" | \"block\">", - "description": "The direction in which the stack's children are placed within the stack.\n\nAccepts:\n- A single value, either `inline` or `block`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported direction values as a query value", + "description": "The direction in which the stack's children are arranged.", "defaultValue": "'block'" }, { @@ -7027,7 +7903,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "JustifyContentKeyword", - "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -7035,7 +7911,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "AlignItemsKeyword", - "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -7043,7 +7919,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "AlignContentKeyword", - "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.", "defaultValue": "'normal'" }, { @@ -7051,7 +7927,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between the stack's children.", "defaultValue": "'none'" }, { @@ -7059,7 +7935,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between rows in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -7067,7 +7943,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between columns in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -7075,7 +7951,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -7083,7 +7959,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -7091,7 +7967,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -7099,7 +7975,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -7107,7 +7983,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -7115,7 +7991,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -7123,7 +7999,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -7131,7 +8007,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -7139,7 +8015,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -7147,7 +8023,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -7155,7 +8031,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -7163,7 +8039,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -7171,7 +8047,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -7179,7 +8055,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -7187,7 +8063,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -7195,7 +8071,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -7203,7 +8079,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -7223,7 +8099,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -7231,7 +8107,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -7239,7 +8115,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -7247,7 +8123,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -7255,14 +8131,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -7270,9 +8146,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7318,7 +8201,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7326,32 +8209,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n accessor direction: StackProps['direction'];\n accessor justifyContent: StackProps['justifyContent'];\n accessor alignItems: StackProps['alignItems'];\n accessor alignContent: StackProps['alignContent'];\n accessor gap: StackProps['gap'];\n accessor rowGap: StackProps['rowGap'];\n accessor columnGap: StackProps['columnGap'];\n}" + "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n /**\n * The direction in which the stack's children are arranged.\n */\n direction: StackProps['direction'];\n /**\n * Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n */\n justifyContent: StackProps['justifyContent'];\n /**\n * Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n */\n alignItems: StackProps['alignItems'];\n /**\n * Controls the distribution of lines along the block axis when content wraps into multiple lines.\n */\n alignContent: StackProps['alignContent'];\n /**\n * The spacing between the stack's children.\n */\n gap: StackProps['gap'];\n /**\n * The spacing between rows in the stack.\n */\n rowGap: StackProps['rowGap'];\n /**\n * The spacing between columns in the stack.\n */\n columnGap: StackProps['columnGap'];\n}" }, "Switch": { "filePath": "src/surfaces/admin/components.ts", "name": "Switch", - "description": "Configure the following properties on the switch component.", - "isPublicDocs": true, + "description": "A switch that lets users toggle a setting on or off with a sliding control.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -7366,7 +8270,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -7374,28 +8278,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -7418,7 +8322,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -7426,23 +8330,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7488,7 +8399,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7496,24 +8407,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Switch extends PreactCheckboxElement implements SwitchProps {\n accessor labelAccessibilityVisibility: SwitchProps['labelAccessibilityVisibility'];\n constructor();\n}" + "value": "declare class Switch extends SwitchBase implements SwitchProps {\n constructor();\n}" }, "Table": { "filePath": "src/surfaces/admin/components.ts", "name": "Table", - "description": "Configure the following properties on the table component.", - "isPublicDocs": true, + "description": "A component that displays data in a structured table format that automatically adapts to the available space.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "variant", "value": "\"auto\" | \"list\"", - "description": "The layout variant of the table component.\n\n- `list`: Always displays as a list layout.\n- `table`: Always displays as a traditional table layout.\n- `auto`: Automatically displays as a table on wide screens and as a list on narrow screens.", + "description": "The display variant of the table.", "defaultValue": "'auto'" }, { @@ -7521,7 +8446,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table. When `true`, the table might be in an inert state that prevents user interaction.", + "description": "Whether the table is currently in a loading state.", "defaultValue": "false" }, { @@ -7529,7 +8454,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paginate", "value": "boolean", - "description": "Whether to use pagination controls.", + "description": "Whether the pagination controls are displayed.", "defaultValue": "false" }, { @@ -7537,7 +8462,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hasPreviousPage", "value": "boolean", - "description": "Whether there's a previous page of data.", + "description": "Whether there's a previous page of data that the user can navigate to.", "defaultValue": "false" }, { @@ -7545,25 +8470,40 @@ "syntaxKind": "PropertyDeclaration", "name": "hasNextPage", "value": "boolean", - "description": "Whether there's an additional page of data.", + "description": "Whether there's a next page of data that the user can navigate to.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@actualTableVariantSymbol@12105", - "value": "AddedContext", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@actualTableVariantSymbol@17550", + "value": "_shopify_admin_web_component_foundations.AddedContext", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@tableHeadersSharedDataSymbol@12106", - "value": "AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", + "name": "__@tableHeadersSharedDataSymbol@17551", + "value": "_shopify_admin_web_component_foundations.AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7609,7 +8549,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7617,78 +8557,69 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Table extends PreactCustomElement implements TableProps {\n accessor variant: TableProps['variant'];\n accessor loading: TableProps['loading'];\n accessor paginate: TableProps['paginate'];\n accessor hasPreviousPage: TableProps['hasPreviousPage'];\n accessor hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" - }, - "AddedContext": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AddedContext", - "description": "", - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "T", - "description": "The current context value.\n\nThe new context value to set, which will notify all consumers." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "addEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", - "description": "The **`addEventListener()`** method of the EventTarget interface sets up a function that will be called whenever the specified event is delivered to the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener)" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "dispatchEvent", - "value": "(event: Event) => boolean", - "description": "The **`dispatchEvent()`** method of the EventTarget sends an Event to the object, (synchronously) invoking the affected event listeners in the appropriate order.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/dispatchEvent)" + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "removeEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", - "description": "The **`removeEventListener()`** method of the EventTarget interface removes an event listener previously registered with EventTarget.addEventListener() from the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/removeEventListener)" + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AddedContext extends EventTarget {\n constructor(defaultValue: T);\n /**\n * The current context value.\n */\n get value(): T;\n /**\n * The new context value to set, which will notify all consumers.\n */\n set value(value: T);\n}" + "value": "declare class Table extends PolarisCustomElement implements TableProps {\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The display variant of the table.\n */\n variant: TableProps['variant'];\n /**\n * Whether the table is currently in a loading state.\n */\n loading: TableProps['loading'];\n /**\n * Whether the pagination controls are displayed.\n */\n paginate: TableProps['paginate'];\n /**\n * Whether there's a previous page of data that the user can navigate to.\n */\n hasPreviousPage: TableProps['hasPreviousPage'];\n /**\n * Whether there's a next page of data that the user can navigate to.\n */\n hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: _shopify_admin_web_component_foundations.AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: _shopify_admin_web_component_foundations.AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" }, "ActualTableVariant": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ActualTableVariant", "value": "'table' | 'list'", - "description": "Represents the actual rendered variant of a table component.\n- `table`: Displays as a traditional table layout.\n- `list`: Displays as a list layout.", - "isPublicDocs": true + "description": "" }, "ListSlotType": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ListSlotType", "value": "'primary' | 'secondary' | 'kicker' | 'inline' | 'labeled'", - "description": "Represents the semantic type of content slots within list items.\n\n- `primary`: The main content or title of the list item.\n- `secondary`: Supporting or descriptive content below the primary content.\n- `kicker`: A small label or tag displayed above the primary content.\n- `inline`: Content displayed inline with the primary content.\n- `labeled`: Content with an associated label.", - "isPublicDocs": true + "description": "" }, "HeaderFormat": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true }, "TableBody": { "filePath": "src/surfaces/admin/components.ts", "name": "TableBody", - "description": "The table body component represents the main content area of a table, containing the data rows. Use table body as a child of table to structure your table data, with each table row within the body representing a single record or entry.\n\nTable body must contain table row components, which in turn contain table cell components for the actual data values.", - "isPublicDocs": true, + "description": "A component that wraps the body content of a table, which contains the data rows.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7734,7 +8665,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7742,26 +8673,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableBody extends PreactCustomElement implements TableBodyProps {\n constructor();\n}" + "value": "declare class TableBody extends PolarisCustomElement implements TableBodyProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n}" }, "TableCell": { "filePath": "src/surfaces/admin/components.ts", "name": "TableCell", - "description": "The table cell component represents a single data cell within a table row. Use table cell as a child of table row to display individual data values, with each cell corresponding to a column in the table.\n\nTable cell automatically inherits styling and alignment from its parent table structure and supports text content or other inline components.", - "isPublicDocs": true, + "description": "A component that represents a single cell in a table row, which displays data in a format that's determined by its column header.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", - "name": "__@headerFormatSymbol@12128", + "name": "__@headerFormatSymbol@17578", "value": "HeaderFormat", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7807,7 +8767,210 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class TableCell extends PolarisCustomElement implements TableCellProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" + }, + "TableHeader": { + "filePath": "src/surfaces/admin/components.ts", + "name": "TableHeader", + "description": "A component that defines a column header in a table, which specifies both the header label and how the column's data should be formatted.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "listSlot", + "value": "ListSlotType", + "description": "The slot where this header's data appears when the table is shown in list view.", + "defaultValue": "'labeled'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "format", + "value": "HeaderFormat", + "description": "The format of the header and its corresponding cells." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class TableHeader\n extends PolarisCustomElement\n implements TableHeaderProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The slot where this header's data appears when the table is shown in list view.\n */\n listSlot: TableHeaderProps['listSlot'];\n /**\n * The format of the header and its corresponding cells.\n */\n format: TableHeaderProps['format'];\n constructor();\n}" + }, + "TableHeaderRow": { + "filePath": "src/surfaces/admin/components.ts", + "name": "TableHeaderRow", + "description": "A component that wraps the header row of a table, which contains the table header components that define the column structure.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7815,169 +8978,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class TableCell extends PreactCustomElement implements TableCellProps {\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" - }, - "TableHeader": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TableHeader", - "description": "The table header component represents a single column header within a table header row. Use table header as a child of table header row to define column headings and optionally enable column sorting.\n\nTable header provides semantic meaning for screen readers and can include sorting controls when configured. Each header corresponds to a column in the table body.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "listSlot", - "value": "ListSlotType", - "description": "The content designation for this column when the table displays in list variant on mobile devices.", - "defaultValue": "'labeled'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "format", - "value": "HeaderFormat", - "description": "The format of the column that controls styling and alignment of cell content." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", + "name": "__@flushRenderSymbol@16092", "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeader\n extends PreactCustomElement\n implements TableHeaderProps\n{\n accessor listSlot: TableHeaderProps['listSlot'];\n accessor format: TableHeaderProps['format'];\n constructor();\n}" + "value": "declare class TableHeaderRow\n extends PolarisCustomElement\n implements TableHeaderRowProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, - "TableHeaderRow": { + "TableRow": { "filePath": "src/surfaces/admin/components.ts", - "name": "TableHeaderRow", - "description": "The table header row component represents the header row of a table, containing column headings. Use table header row as the first child of table (before table body) to define the table structure and provide column labels.\n\nTable header row must contain table header components for each column. These headers provide context for the data columns and can support sorting functionality.", - "isPublicDocs": true, + "name": "TableRow", + "description": "A component that represents a single row in a table, which contains the data cells.", "members": [ { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertyDeclaration", + "name": "clickDelegate", + "value": "string", + "description": "A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector." }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - } - ], - "value": "declare class TableHeaderRow\n extends PreactCustomElement\n implements TableHeaderRowProps\n{\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" - }, - "TableRow": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TableRow", - "description": "The table row component represents a single row of data within a table body. Use table row as a child of table body to structure individual records or entries in the table.\n\nTable row must contain table cell components, with each cell representing a data value for the corresponding column. The number of cells should match the number of headers in the table.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "clickDelegate", - "value": "string", - "description": "The ID of an interactive element, such as `s-link`, in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally." + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -8024,7 +9071,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8032,41 +9079,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableRow extends PreactCustomElement implements TableRowProps {\n constructor();\n accessor clickDelegate: string;\n}" + "value": "declare class TableRow extends PolarisCustomElement implements TableRowProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /**\n * A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector.\n */\n clickDelegate: string;\n}" }, "Text": { "filePath": "src/surfaces/admin/components.ts", "name": "Text", - "description": "Configure the following properties on the text component.", - "isPublicDocs": true, + "description": "A custom element for displaying inline or small blocks of text with various visual styles and semantic meanings. Use Text to render short pieces of content with appropriate styling, emphasis, and color treatment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color of the text.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", @@ -8081,7 +9142,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -8089,7 +9150,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, { @@ -8097,7 +9158,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The ID of an element this text provides contextual information for." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -8144,7 +9212,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8152,24 +9220,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Text extends PreactCustomElement implements TextProps {\n accessor fontVariantNumeric: TextProps['fontVariantNumeric'];\n accessor color: TextProps['color'];\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: TextProps['tone'];\n /**\n * The semantic type and styling treatment for the text content.\n *\n * - `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n * - `generic`: Standard text with no special semantic meaning or styling.\n * - `address`: Marks the text as contact information, such as a physical or email address.\n * - `redundant`: Indicates the text is redundant or duplicated information for screen reader context.\n */\n accessor type: TextProps['type'];\n accessor dir: TextProps['dir'];\n accessor accessibilityVisibility: TextProps['accessibilityVisibility'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Text extends TextBase implements TextProps {\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: TextProps['tone'];\n constructor();\n}" }, "TextArea": { "filePath": "src/surfaces/admin/components.ts", "name": "TextArea", - "description": "Configure the following properties on the text area component.", - "isPublicDocs": true, + "description": "The text area custom element class that renders a multi-line text input field in the Shopify admin interface. This component allows merchants to enter and edit longer text content with support for labels, validation, and length constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -8177,7 +9259,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, { @@ -8185,22 +9267,15 @@ "syntaxKind": "PropertyDeclaration", "name": "rows", "value": "number", - "description": "A number of visible text lines.", + "description": "The number of visible text lines for the field, controlling its initial height.", "defaultValue": "2" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -8208,35 +9283,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -8244,14 +9319,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -8259,7 +9334,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -8283,7 +9358,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -8307,7 +9382,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -8315,23 +9390,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8369,7 +9458,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8377,24 +9466,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextArea\n extends PreactFieldElement\n implements TextAreaProps\n{\n accessor maxLength: TextAreaProps['maxLength'];\n accessor minLength: TextAreaProps['minLength'];\n accessor rows: TextAreaProps['rows'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextArea extends TextAreaBase implements TextAreaProps {\n constructor();\n}" }, "TextField": { "filePath": "src/surfaces/admin/components.ts", "name": "TextField", - "description": "Configure the following properties on the text field component.", - "isPublicDocs": true, + "description": "The text field custom element class that renders a single-line text input field in the Shopify admin interface. This component allows merchants to enter and edit text with support for labels, validation, icons, and prefix/suffix content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\" | AnyString", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "value": "IconType | AnyString", + "description": "An icon to display at the start of the text field, providing visual context for the input. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", "defaultValue": "''" }, { @@ -8402,7 +9505,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the merchant can enter in the field. When this limit is reached, the field prevents further input.", "defaultValue": "Infinity" }, { @@ -8410,7 +9513,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation. The field will be considered invalid if the merchant enters fewer characters than this value.", "defaultValue": "0" }, { @@ -8418,7 +9521,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the merchant's input, such as a currency symbol (`$`) or protocol (`https://`).", "defaultValue": "''" }, { @@ -8426,22 +9529,15 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the merchant's input, such as a unit of measurement (`kg`, `%`) or domain (`.myshopify.com`).", "defaultValue": "''" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -8449,35 +9545,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -8485,14 +9581,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -8500,7 +9596,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -8524,7 +9620,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -8548,7 +9644,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -8556,23 +9652,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8610,7 +9720,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8618,41 +9728,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextField\n extends PreactFieldElement\n implements TextFieldProps\n{\n accessor icon: TextFieldProps['icon'];\n accessor maxLength: TextFieldProps['maxLength'];\n accessor minLength: TextFieldProps['minLength'];\n accessor prefix: TextFieldProps['prefix'];\n accessor suffix: TextFieldProps['suffix'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextField extends TextFieldBase implements TextFieldProps {\n constructor();\n}" }, "Thumbnail": { "filePath": "src/surfaces/admin/components.ts", "name": "Thumbnail", - "description": "Configure the following properties on the thumbnail component.", - "isPublicDocs": true, + "description": "A thumbnail displays a small preview image with configurable sizing.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display in the thumbnail." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the product thumbnail image.\n\n- `small-200`: Smallest thumbnail size, ideal for compact product lists or tables.\n- `small-100`: Very small thumbnail, suitable for dense layouts.\n- `small`: Small thumbnail for space-constrained contexts.\n- `base`: Default size that balances visibility and space efficiency.\n- `large`: Larger thumbnail for featured products or detailed views.\n- `large-100`: Extra large thumbnail for prominent product display.", + "description": "The size of the thumbnail.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8698,7 +9829,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8706,22 +9837,36 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Thumbnail extends PreactCustomElement implements ThumbnailProps {\n accessor src: ThumbnailProps['src'];\n accessor alt: ThumbnailProps['alt'];\n accessor size: ThumbnailProps['size'];\n constructor();\n}" + "value": "declare class Thumbnail extends PolarisCustomElement implements ThumbnailProps {\n /**\n * The URL of the image to display in the thumbnail.\n */\n src: ThumbnailProps['src'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ThumbnailProps['alt'];\n /**\n * The size of the thumbnail.\n */\n size: ThumbnailProps['size'];\n constructor();\n}" }, "Tooltip": { "filePath": "src/surfaces/admin/components.ts", "name": "Tooltip", - "description": "Configure the following properties on the tooltip component.", - "isPublicDocs": true, + "description": "A component that displays a small popup with explanatory text when the user hovers over or focuses on an element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -8729,7 +9874,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -8737,11 +9882,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8787,7 +9939,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8795,8 +9947,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Tooltip extends PreactOverlayElement implements TooltipProps {\n constructor();\n}" @@ -8804,9 +9971,15 @@ "UnorderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "UnorderedList", - "description": "Configure the following properties on the unordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a bulleted list of items where the order doesn't matter. Use unordered list when you have a collection of related items without a specific sequence, such as features, options, or bullet points.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8852,7 +10025,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8860,32 +10033,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class UnorderedList\n extends PreactCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" + "value": "declare class UnorderedList\n extends PolarisCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" }, "URLField": { "filePath": "src/surfaces/admin/components.ts", "name": "URLField", - "description": "Configure the following properties on the URL field component.", - "isPublicDocs": true, + "description": "The URL field custom element class that renders a URL input field in the Shopify admin interface. This component allows merchants to enter web addresses with automatic URL validation and appropriate mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | `section-${string} url` | `section-${string} photo` | `section-${string} impp` | `section-${string} home impp` | `section-${string} mobile impp` | `section-${string} fax impp` | `section-${string} pager impp` | \"shipping url\" | \"shipping photo\" | \"shipping impp\" | \"shipping home impp\" | \"shipping mobile impp\" | \"shipping fax impp\" | \"shipping pager impp\" | \"billing url\" | \"billing photo\" | \"billing impp\" | \"billing home impp\" | \"billing mobile impp\" | \"billing fax impp\" | \"billing pager impp\" | `section-${string} shipping url` | `section-${string} shipping photo` | `section-${string} shipping impp` | `section-${string} shipping home impp` | `section-${string} shipping mobile impp` | `section-${string} shipping fax impp` | `section-${string} shipping pager impp` | `section-${string} billing url` | `section-${string} billing photo` | `section-${string} billing impp` | `section-${string} billing home impp` | `section-${string} billing mobile impp` | `section-${string} billing fax impp` | `section-${string} billing pager impp` | URLAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint about the intended content of the field for browser autofill.", + "defaultValue": "'url'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the URL.", "defaultValue": "Infinity" }, { @@ -8893,50 +10080,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the URL.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -8944,14 +10124,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -8959,7 +10139,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -8983,7 +10163,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -9007,7 +10187,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -9015,23 +10195,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -9069,7 +10263,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -9077,41 +10271,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class URLField\n extends PreactFieldElement\n implements URLFieldProps\n{\n accessor autocomplete: URLFieldProps['autocomplete'];\n accessor maxLength: URLFieldProps['maxLength'];\n accessor minLength: URLFieldProps['minLength'];\n /**\n * The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class URLField extends URLFieldBase implements URLFieldProps {\n constructor();\n}" }, "URLAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "URLAutocompleteField", "value": "'url' | 'photo' | 'impp' | 'home impp' | 'mobile impp' | 'fax impp' | 'pager impp'", - "description": "Represents autocomplete values that are valid for URL input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for URL inputs.\n\nAvailable values:\n- `url` - General URL or web address\n- `photo` - URL to a photo or image\n- `impp` - Instant messaging protocol URL\n- `home impp` - Home instant messaging protocol URL\n- `mobile impp` - Mobile instant messaging protocol URL\n- `fax impp` - Fax instant messaging protocol URL\n- `pager impp` - Pager instant messaging protocol URL", - "isPublicDocs": true + "description": "" }, "AdminAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminAction", - "description": "Configure the following properties on the admin action component.", - "isPublicDocs": true, + "description": "The admin action custom element class that renders action controls in the Shopify admin interface. This component creates a standardized action area with a heading and slots for primary and secondary action buttons, used exclusively in admin action extensions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text to use as the Action modal's title. If not provided, the name of the extension will be used." + "description": "The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the action is in a loading state, such as during initial page load or when the action is being opened. When `true`, the action might be in an inert state that prevents user interaction.", + "description": "Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -9157,7 +10371,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -9165,11 +10379,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminAction\n extends PreactCustomElement\n implements AdminActionProps\n{\n /**\n * The text to use as the Action modal's title. If not provided, the name of the extension will be used.\n */\n heading: string;\n /**\n * Whether the action is in a loading state, such as during initial page load or when the action is being opened.\n * When `true`, the action might be in an inert state that prevents user interaction.\n */\n loading: boolean;\n constructor();\n}" + "value": "declare class AdminAction\n extends PolarisCustomElement\n implements AdminActionProps\n{\n /**\n * The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading.\n */\n heading: string;\n /**\n * Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.\n *\n * @default false\n */\n loading: boolean;\n constructor();\n}" }, "RunnableExtension": { "filePath": "src/extension.ts", @@ -9314,9 +10543,17 @@ "value": "string | URL", "description": "The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.", + "isOptional": true } ], - "value": "export interface Intents {\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" + "value": "export interface Intents {\n /**\n * Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.\n */\n response?: IntentResponseApi;\n\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" }, "IntentInvokeApi": { "filePath": "src/surfaces/admin/api/intents/intents.ts", @@ -9326,6 +10563,67 @@ "members": [], "value": "export interface IntentInvokeApi {\n (query: IntentQuery): Promise;\n (intentURL: string, options?: IntentQueryOptions): Promise;\n}" }, + "IntentResponseApi": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "IntentResponseApi", + "description": "The `IntentResponseApi` object provides methods for resolving the current intent from within an invoked extension. This API is only present when your extension is running inside an intent workflow.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "closed", + "value": "() => Promise", + "description": "Resolves the current intent as closed without completing the workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "error", + "value": "(message: string, issues?: Issue[]) => Promise", + "description": "Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "ok", + "value": "(data?: { [key: string]: unknown; }) => Promise", + "description": "Resolves the current intent successfully. Pass output data when your intent defines a response schema." + } + ], + "value": "export interface IntentResponseApi {\n /**\n * Resolves the current intent successfully. Pass output data when your intent defines a response schema.\n */\n ok(data?: SuccessIntentResponse['data']): Promise;\n\n /**\n * Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available.\n */\n error(message: string, issues?: Issue[]): Promise;\n\n /**\n * Resolves the current intent as closed without completing the workflow.\n */\n closed(): Promise;\n}" + }, + "Issue": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "Issue", + "description": "A structured issue describing a validation or workflow error.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "code", + "value": "string", + "description": "A machine-readable error code for this issue. Use this for programmatic error handling or logging.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "message", + "value": "string", + "description": "A description of what's wrong with this field. Display this to help merchants understand how to fix the error.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "path", + "value": "string[]", + "description": "The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure.", + "isOptional": true + } + ], + "value": "export interface Issue {\n /** The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure. */\n path?: string[];\n /** A description of what's wrong with this field. Display this to help merchants understand how to fix the error. */\n message?: string;\n /** A machine-readable error code for this issue. Use this for programmatic error handling or logging. */\n code?: string;\n}" + }, "ApiVersion": { "filePath": "src/shared.ts", "syntaxKind": "TypeAliasDeclaration", @@ -9934,22 +11232,28 @@ "AdminBlock": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminBlock", - "description": "Configure the following properties on the admin block component.", - "isPublicDocs": true, + "description": "The admin block custom element class that renders a collapsible content block in the Shopify admin interface. This component organizes content into expandable sections with headings and provides a summary when collapsed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text displayed as the block's title in the header. If not provided, the extension name will be used." + "description": "The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "collapsedSummary", "value": "string", - "description": "The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated." + "description": "The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -9996,7 +11300,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -10004,18 +11308,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminBlock\n extends PreactCustomElement\n implements AdminBlockProps\n{\n /**\n * The text displayed as the block's title in the header. If not provided, the extension name will be used.\n */\n heading: string;\n /**\n * The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated.\n */\n collapsedSummary: string;\n constructor();\n}" + "value": "declare class AdminBlock\n extends PolarisCustomElement\n implements AdminBlockProps\n{\n /**\n * The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed.\n */\n heading: string;\n /**\n * The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed.\n */\n collapsedSummary: string;\n constructor();\n}" }, "Form": { "filePath": "src/surfaces/admin/components.ts", "name": "Form", - "description": "Configure the following properties on the form component.", - "isPublicDocs": true, + "description": "The form custom element class that renders a form container in the Shopify admin interface. This component manages form submission, validation, and reset behavior for collecting merchant input.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -10061,7 +11386,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -10069,11 +11394,114 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Form extends PreactCustomElement implements FormProps {\n constructor();\n}" + "value": "declare class Form extends PolarisCustomElement implements FormProps {\n constructor();\n}" + }, + "IntentRenderApi": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderApi", + "description": "The `IntentRenderApi` object provides methods for extensions that render in response to an app intent. Access the intent data to determine what action the merchant requested and use `intents.response` to resolve the intent when complete.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "auth", + "value": "Auth", + "description": "Provides methods for authenticating calls to your app backend. Use the `idToken()` method to retrieve a signed JWT token that verifies the current user's identity for secure server-side operations." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "extension", + "value": "{ target: ExtensionTarget; }", + "description": "The identifier of the running extension target. Use this to determine which target your extension is rendering in and conditionally adjust functionality or UI based on the extension context." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "i18n", + "value": "I18n", + "description": "Utilities for translating content according to the current localization of the admin. Use these methods to provide translated strings that match the merchant's language preferences, ensuring your extension is accessible to a global audience." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "intents", + "value": "IntentRenderIntents", + "description": "Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "picker", + "value": "PickerApi", + "description": "Opens a custom selection dialog with your app-specific data. Use the [Picker API](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/picker-api) to define the picker's heading, items, headers, and selection behavior. Returns a Promise that resolves to a `Picker` object with a `selected` property for accessing the merchant's selection." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "query", + "value": "(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>", + "description": "Executes GraphQL queries against the [GraphQL Admin API](/docs/api/admin-graphql). Use this to fetch shop data, manage resources, or perform mutations. Queries are automatically authenticated with the current user's permissions. Optionally specify GraphQL variables and API version for your query." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "resourcePicker", + "value": "ResourcePickerApi", + "description": "Opens the [resource picker](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/resource-picker-api) modal for selecting products, variants, or collections. Returns the selected resources when the user confirms their selection, or undefined if they cancel." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "storage", + "value": "Storage", + "description": "Provides methods for persisting data in browser storage that is scoped to your extension. Use this to store user preferences, cache data, maintain state across sessions, or save temporary working data. Storage is persistent across page reloads and isolated per extension." + } + ], + "value": "export interface IntentRenderApi\n extends StandardRenderingExtensionApi {\n /**\n * Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow.\n */\n intents: IntentRenderIntents;\n}" + }, + "IntentRenderIntents": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderIntents", + "description": "The intents API available to intent render extensions. Unlike other targets where `response` is optional, intent render extensions always run inside an intent workflow so `response` is guaranteed.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled." + } + ], + "value": "export interface IntentRenderIntents {\n /**\n * Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled.\n */\n response: IntentResponseApi;\n}" + }, + "FormExtensionComponents": { + "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "FormExtensionComponents", + "value": "StandardComponents | 'Form'", + "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." }, "StandardApi": { "filePath": "src/surfaces/admin/api/standard/standard.ts", @@ -10727,19 +12155,18 @@ "value": "FormExtensionComponents | 'FunctionSettings'", "description": "The components available for building function settings extensions. Includes all form components plus the function settings component required for function settings configuration." }, - "FormExtensionComponents": { - "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "FormExtensionComponents", - "value": "StandardComponents | 'Form'", - "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." - }, "FunctionSettings": { "filePath": "src/surfaces/admin/components.ts", "name": "FunctionSettings", - "description": "Configure the following properties on the function settings component.", - "isPublicDocs": true, + "description": "The function settings custom element class that renders a specialized form for configuring Shopify Function settings in the admin interface. This component manages function configuration submission, validation, and error handling.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -10785,7 +12212,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -10793,8 +12220,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class FunctionSettings\n extends PreactCustomElement\n implements FunctionSettingsProps\n{\n constructor();\n}" @@ -10881,15 +12323,21 @@ "AdminPrintAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminPrintAction", - "description": "Configure the following properties on the admin print action component.", - "isPublicDocs": true, + "description": "The admin print action custom element class that renders a print interface in the Shopify admin. This component enables merchants to print content from a specified source URL using the browser's print functionality.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The `src` URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs, and images are supported." + "description": "The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -10936,7 +12384,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -10944,11 +12392,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminPrintAction\n extends PreactCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The `src` URL of the preview and the document to print.\n * If not provided, the preview will show an empty state and the print button will be disabled.\n * HTML, PDFs, and images are supported.\n */\n src: string;\n constructor();\n}" + "value": "declare class AdminPrintAction\n extends PolarisCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action.\n */\n src: string;\n constructor();\n}" }, "ProductDetailsConfigurationApi": { "filePath": "src/surfaces/admin/api/product-configuration/product-details-configuration.ts", @@ -11966,6 +13429,13 @@ "value": "RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >", "description": "A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options." }, + { + "filePath": "src/surfaces/admin/extension-targets.ts", + "syntaxKind": "PropertySignature", + "name": "admin.app.intent.render", + "value": "RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >", + "description": "Renders an admin extension for handling app intents." + }, { "filePath": "src/surfaces/admin/extension-targets.ts", "syntaxKind": "PropertySignature", @@ -12493,7 +13963,7 @@ "description": "A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules." } ], - "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n}" + "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n\n /**\n * Renders an admin extension for handling app intents.\n */\n 'admin.app.intent.render': RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >;\n}" }, "RenderExtension": { "filePath": "src/extension.ts", @@ -12667,9 +14137,17 @@ "value": "string | URL", "description": "The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.", + "isOptional": true } ], - "value": "export interface Intents {\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" + "value": "export interface Intents {\n /**\n * Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.\n */\n response?: IntentResponseApi;\n\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" }, "IntentInvokeApi": { "filePath": "src/surfaces/admin/api/intents/intents.ts", @@ -12679,6 +14157,67 @@ "members": [], "value": "export interface IntentInvokeApi {\n (query: IntentQuery): Promise;\n (intentURL: string, options?: IntentQueryOptions): Promise;\n}" }, + "IntentResponseApi": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "IntentResponseApi", + "description": "The `IntentResponseApi` object provides methods for resolving the current intent from within an invoked extension. This API is only present when your extension is running inside an intent workflow.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "closed", + "value": "() => Promise", + "description": "Resolves the current intent as closed without completing the workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "error", + "value": "(message: string, issues?: Issue[]) => Promise", + "description": "Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "ok", + "value": "(data?: { [key: string]: unknown; }) => Promise", + "description": "Resolves the current intent successfully. Pass output data when your intent defines a response schema." + } + ], + "value": "export interface IntentResponseApi {\n /**\n * Resolves the current intent successfully. Pass output data when your intent defines a response schema.\n */\n ok(data?: SuccessIntentResponse['data']): Promise;\n\n /**\n * Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available.\n */\n error(message: string, issues?: Issue[]): Promise;\n\n /**\n * Resolves the current intent as closed without completing the workflow.\n */\n closed(): Promise;\n}" + }, + "Issue": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "Issue", + "description": "A structured issue describing a validation or workflow error.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "code", + "value": "string", + "description": "A machine-readable error code for this issue. Use this for programmatic error handling or logging.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "message", + "value": "string", + "description": "A description of what's wrong with this field. Display this to help merchants understand how to fix the error.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "path", + "value": "string[]", + "description": "The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure.", + "isOptional": true + } + ], + "value": "export interface Issue {\n /** The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure. */\n path?: string[];\n /** A description of what's wrong with this field. Display this to help merchants understand how to fix the error. */\n message?: string;\n /** A machine-readable error code for this issue. Use this for programmatic error handling or logging. */\n code?: string;\n}" + }, "PickerApi": { "filePath": "src/surfaces/admin/api/picker/picker.ts", "name": "PickerApi", @@ -13172,29 +14711,28 @@ "Avatar": { "filePath": "src/surfaces/admin/components.ts", "name": "Avatar", - "description": "Configure the following properties on the avatar component.", - "isPublicDocs": true, + "description": "An avatar displays a user or entity image with fallback initials when the image isn't available.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "initials", "value": "string", - "description": "The initials to display in the avatar when no image is provided or fails to load. Typically one or two characters representing a person's first and last name initials, such as \"JD\" for John Doe." + "description": "The initials to display when no image is provided or if the image fails to load." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The URL or path to the avatar image. When provided, the image takes priority over `initials`. If the image fails to load or loads slowly, `initials` will be rendered as a fallback." + "description": "The URL of the avatar image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"base\" | \"large\" | \"large-200\"", - "description": "The size of the avatar image.\n\n- `small-200`: Extra small avatar, suitable for compact displays or lists with many items.\n- `small`: Small avatar, good for secondary contexts or tight layouts.\n- `base`: Default size that works well in most contexts.\n- `large`: Large avatar for emphasis or when the avatar is a focal point.\n- `large-200`: Extra large avatar for prominent display.", + "description": "The size of the avatar.", "defaultValue": "'base'" }, { @@ -13202,7 +14740,14 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the avatar for accessibility.\n\nProvides a text description of the avatar for users with assistive technology and serves as a fallback when the avatar fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an avatar, it reads this description aloud. When an avatar fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt)." + "description": "Alternative text that describes the avatar for screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -13249,7 +14794,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -13257,17 +14802,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Avatar extends PreactCustomElement implements AvatarProps {\n accessor initials: AvatarProps['initials'];\n accessor src: AvatarProps['src'];\n accessor size: AvatarProps['size'];\n accessor alt: AvatarProps['alt'];\n constructor();\n}" + "value": "declare class Avatar extends PolarisCustomElement implements AvatarProps {\n /**\n * The initials to display when no image is provided or if the image fails to load.\n */\n initials: AvatarProps['initials'];\n /**\n * The URL of the avatar image to display.\n */\n src: AvatarProps['src'];\n /**\n * The size of the avatar.\n */\n size: AvatarProps['size'];\n /**\n * Alternative text that describes the avatar for screen readers.\n */\n alt: AvatarProps['alt'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -13290,68 +14849,75 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred." + "description": "" } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" }, "Badge": { "filePath": "src/surfaces/admin/components.ts", "name": "Badge", - "description": "Configure the following properties on the badge component.", - "isPublicDocs": true, + "description": "The badge custom element class that renders status indicators in the Shopify admin interface. This component displays compact visual indicators with customizable tones, sizes, and optional icons to communicate status information to merchants.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"strong\"", - "description": "Controls the visual weight and emphasis of the badge.\n\n- `base`: Standard weight with moderate emphasis, suitable for most use cases.\n- `strong`: Increased visual weight for higher emphasis and prominence.", - "defaultValue": "'base'" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the badge to provide additional visual context or reinforce the badge's meaning. Accepts any icon name from the icon library or a custom string identifier." + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"strong\"", + "description": "The visual weight of the badge. Available options: `'base'` for standard weight or `'strong'` for increased emphasis.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the badge.\n\n- `base`: Default size suitable for most badge use cases.\n- `large`: Larger badge for increased visibility and prominence.\n- `large-100`: Extra large badge for maximum visibility in emphasized contexts.", + "description": "The size of the badge. Available options: `'base'` for standard size, `'large'` for larger size, or `'large-100'` for extra large size.", "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", - "defaultValue": "'auto'" + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -13398,7 +14964,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -13406,17 +14972,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Badge extends PreactCustomElement implements BadgeProps {\n accessor color: BadgeProps['color'];\n accessor icon: BadgeProps['icon'];\n accessor size: BadgeProps['size'];\n accessor tone: BadgeProps['tone'];\n constructor();\n}" + "value": "declare class Badge extends BadgeBase implements BadgeProps {\n /**\n * The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: BadgeProps['icon'];\n /**\n * The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.\n */\n tone: BadgeProps['tone'];\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "Banner": { "filePath": "src/surfaces/admin/components.ts", "name": "Banner", - "description": "Configure the following properties on the banner component.", - "isPublicDocs": true, + "description": "A custom element for displaying important messages and notifications.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -13431,7 +15018,7 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.", + "description": "The color tone of the banner based on its semantic meaning.", "defaultValue": "'auto'" }, { @@ -13439,7 +15026,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Controls whether the banner is visible or hidden.\n\nWhen using a controlled component pattern and the banner is `dismissible`, update this property to `true` when the `dismiss` event fires.\n\nYou can hide the banner programmatically by setting this to `true` even if it's not `dismissible`.", + "description": "Whether the banner is hidden from view.", "defaultValue": "false" }, { @@ -13447,9 +15034,16 @@ "syntaxKind": "PropertyDeclaration", "name": "dismissible", "value": "boolean", - "description": "Whether the banner displays a close button that allows users to dismiss it.\n\nWhen the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, any animation completes, and the `afterhide` event fires.", + "description": "Whether the banner can be dismissed by the user.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -13495,7 +15089,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -13503,24 +15097,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Banner extends PreactCustomElement implements BannerProps {\n accessor heading: BannerProps['heading'];\n accessor tone: BannerProps['tone'];\n accessor hidden: BannerProps['hidden'];\n accessor dismissible: BannerProps['dismissible'];\n constructor();\n}" + "value": "declare class Banner extends PolarisCustomElement implements BannerProps {\n /**\n * The heading text displayed at the top of the banner.\n */\n heading: BannerProps['heading'];\n /**\n * The color tone of the banner based on its semantic meaning.\n */\n tone: BannerProps['tone'];\n /**\n * Whether the banner is hidden from view.\n */\n hidden: BannerProps['hidden'];\n /**\n * Whether the banner can be dismissed by the user.\n */\n dismissible: BannerProps['dismissible'];\n constructor();\n}" }, "Box": { "filePath": "src/surfaces/admin/components.ts", "name": "Box", - "description": "Configure the following properties on the box component.", - "isPublicDocs": true, + "description": "A box is a container component that provides control over layout, spacing, and styling.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -13528,7 +15136,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -13536,7 +15144,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -13544,7 +15152,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -13552,7 +15160,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -13560,7 +15168,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -13568,7 +15176,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -13576,7 +15184,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -13584,7 +15192,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -13592,7 +15200,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -13600,7 +15208,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -13608,7 +15216,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -13616,7 +15224,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -13624,7 +15232,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -13632,7 +15240,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -13640,7 +15248,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -13648,7 +15256,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -13668,7 +15276,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -13676,7 +15284,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -13684,7 +15292,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -13692,7 +15300,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -13700,14 +15308,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -13715,9 +15323,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -13763,7 +15378,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -13771,8 +15386,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Box extends BoxElement implements BoxProps {\n constructor();\n}" @@ -13781,120 +15411,106 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -13902,60 +15518,60 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "Button": { "filePath": "src/surfaces/admin/components.ts", "name": "Button", - "description": "Configure the following properties on the button component.", - "isPublicDocs": true, + "description": "The button custom element class that renders interactive buttons in the Shopify admin interface. This component triggers actions or navigation when clicked, with customizable visual styles, states, and optional icons.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", - "defaultValue": "false" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier." + "name": "variant", + "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", + "description": "The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.", + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "loading", - "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", - "defaultValue": "false" + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "variant", - "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "defaultValue": "'auto'" + "name": "disabled", + "value": "boolean", + "description": "Whether the button is disabled, preventing any interaction. When `true`, the button appears visually disabled and doesn't respond to user clicks.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" + "name": "loading", + "value": "boolean", + "description": "Whether the button is in a loading state. When `true`, displays a loading indicator and prevents interaction to show that an action is in progress.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to open the linked document when the button acts as a link. Available options: `''`, `'_blank'`, `'_self'`, `'_parent'`, or `'_top'`.", "defaultValue": "'auto'" }, { @@ -13963,21 +15579,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "A URL that the button should navigate to when clicked. When provided, the button behaves as a link." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Prompts the user to save the linked URL as a file with the specified filename. Only works when `href` is provided." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The button's behavior in forms. Available options: `'button'`, `'submit'`, or `'reset'`.", "defaultValue": "'button'" }, { @@ -13985,117 +15601,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", - "defaultValue": "'--auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "A text description of the button's purpose for screen readers. This is essential for accessibility when the button doesn't have visible text." }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." - } - ], - "value": "declare class Button extends Button_base implements ButtonProps {\n accessor disabled: ButtonProps['disabled'];\n accessor icon: ButtonProps['icon'];\n accessor loading: ButtonProps['loading'];\n accessor variant: ButtonProps['variant'];\n accessor tone: ButtonProps['tone'];\n accessor target: ButtonProps['target'];\n accessor href: ButtonProps['href'];\n accessor download: ButtonProps['download'];\n accessor type: ButtonProps['type'];\n accessor accessibilityLabel: ButtonProps['accessibilityLabel'];\n constructor();\n}" - }, - "AnyString": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "AnyString", - "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true - }, - "ButtonGroup": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ButtonGroup", - "description": "Configure the following properties on the button group component.", - "isPublicDocs": true, - "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "gap", - "value": "\"base\" | \"none\"", - "description": "The spacing between buttons in the group.\n\n- `base`: Standard spacing that provides clear visual separation between buttons.\n- `none`: No spacing, creating a connected button group.", - "defaultValue": "'base'" + "name": "inlineSize", + "value": "\"auto\" | \"fill\" | \"fit-content\"", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -14142,7 +15663,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -14150,39 +15671,197 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle'", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", + "defaultValue": "'--auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "commandFor", + "value": "string", + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", + "value": "string", + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class ButtonGroup\n extends PreactCustomElement\n implements ButtonGroupProps\n{\n accessor gap: ButtonGroupProps['gap'];\n accessor accessibilityLabel: ButtonGroupProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Button\n extends ButtonBase\n implements ButtonProps\n{\n /**\n * The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: ButtonProps['icon'];\n /**\n * The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.\n */\n variant: ButtonProps['variant'];\n /**\n * The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.\n */\n tone: ButtonProps['tone'];\n constructor();\n}" + }, + "AnyString": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "AnyString", + "value": "string & {}", + "description": "Prevents widening string literal types in a union to `string`." + }, + "ButtonGroup": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ButtonGroup", + "description": "A button group that arranges multiple buttons together with consistent spacing and semantic grouping for related actions.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "gap", + "value": "\"base\" | \"none\"", + "description": "The amount of spacing between buttons in the group, affecting the visual separation of actions.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that's only visible to screen readers, describing the purpose of this group of buttons." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class ButtonGroup extends ButtonGroupBase implements ButtonGroupProps {\n constructor();\n}" }, "Checkbox": { "filePath": "src/surfaces/admin/components.ts", "name": "Checkbox", - "description": "Configure the following properties on the checkbox component.", - "isPublicDocs": true, + "description": "A checkbox that lets users select or deselect an option, with support for an indeterminate state.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "indeterminate", "value": "boolean", - "description": "Whether the checkbox displays in an indeterminate state (neither checked nor unchecked), typically used to indicate partial selection in hierarchical lists.\n\nThis visual state takes priority over the `checked` prop in appearance only. The form submission value is still determined by the `checked` prop.\n\nIf `indeterminate` has not been explicitly set and hasn't been modified by user interaction, it returns the value of `defaultIndeterminate`." + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultIndeterminate", "value": "boolean", - "description": "The initial indeterminate state for uncontrolled components. Use this when you want the checkbox to start in an indeterminate state but don't need to control it afterward.\n\nThis value applies until `indeterminate` is explicitly set or the user changes the checkbox state by clicking.", + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "labelAccessibilityVisibility", + "value": "\"visible\" | \"exclusive\"", + "description": "", + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -14197,7 +15876,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -14205,28 +15884,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -14249,7 +15928,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -14257,23 +15936,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -14319,7 +16005,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -14327,24 +16013,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Checkbox extends PreactCheckboxElement implements CheckboxProps {\n get indeterminate(): CheckboxProps['indeterminate'];\n set indeterminate(indeterminate: CheckboxProps['indeterminate']);\n accessor defaultIndeterminate: CheckboxProps['defaultIndeterminate'];\n constructor();\n}" + "value": "declare class Checkbox extends CheckboxBase implements CheckboxProps {\n constructor();\n}" + }, + "CallbackEvent": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CallbackEvent", + "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." }, "Chip": { "filePath": "src/surfaces/admin/components.ts", "name": "Chip", - "description": "Configure the following properties on the chip component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "Modify the color to be more or less intense.", "defaultValue": "'base'" }, { @@ -14352,7 +16059,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -14399,7 +16121,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -14407,24 +16129,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Chip extends PreactCustomElement implements ChipProps {\n accessor color: ChipProps['color'];\n accessor accessibilityLabel: ChipProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Chip extends PolarisCustomElement implements ChipProps {\n color: ChipProps['color'];\n accessibilityLabel: ChipProps['accessibilityLabel'];\n removable: ChipProps['removable'];\n constructor(renderImpl?: Omit);\n}" }, "Choice": { "filePath": "src/surfaces/admin/components.ts", "name": "Choice", - "description": "The choice component creates individual selectable options within a choice list. Use choice to define each option that merchants can select, supporting both single selection (radio buttons) and multiple selection (checkboxes) modes.\n\nChoice components support labels, help text, and custom content through slots, providing flexible option presentation within choice lists.", - "isPublicDocs": true, + "description": "A single choice within a choice list that can be selected with a radio button or checkbox.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the choice is disabled and can't be selected.", "defaultValue": "false" }, { @@ -14432,7 +16168,7 @@ "syntaxKind": "GetAccessor", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the choice is currently selected.", "defaultValue": "false" }, { @@ -14440,21 +16176,21 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this choice is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, used when the visual label isn't descriptive enough." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the choice should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -14473,6 +16209,13 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -14502,7 +16245,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -14510,24 +16253,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Choice extends PreactCustomElement implements ChoiceProps {\n accessor disabled: ChoiceProps['disabled'];\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n accessor value: ChoiceProps['value'];\n accessor accessibilityLabel: ChoiceProps['accessibilityLabel'];\n accessor defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Choice extends PolarisCustomElement implements ChoiceProps {\n /**\n * Whether the choice is disabled and can't be selected.\n */\n disabled: ChoiceProps['disabled'];\n /**\n * Whether the choice is currently selected.\n */\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n /**\n * The value that's submitted with the form when this choice is selected.\n */\n value: ChoiceProps['value'];\n /**\n * A label that's only visible to screen readers, used when the visual label isn't descriptive enough.\n */\n accessibilityLabel: ChoiceProps['accessibilityLabel'];\n /**\n * Whether the choice should be selected when it's first rendered.\n */\n defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ChoiceList": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceList", - "description": "Configure the following properties on the choice list component.", - "isPublicDocs": true, + "description": "A list of choices that lets users select one or more options using radio buttons or checkboxes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "addEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", + "description": "Wraps change and input event listeners so they only fire when the event was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n\nThis prevents form events from elements inside secondary content (e.g. TextField, native ) from being mistakenly treated as ChoiceList value-change events, while still allowing those events to bubble normally through the DOM (preserving React's event delegation).", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "removeEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction. When `true`, the `disabled` property on any child choices is ignored.", + "description": "Whether all choices in the list are disabled and can't be selected.", "defaultValue": "false" }, { @@ -14535,43 +16308,43 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name that identifies this choice list when the form is submitted." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the choice list when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the choice list." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "multiple", "value": "boolean", - "description": "Whether multiple choices can be selected.", + "description": "Whether users can select more than one choice at a time.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the choice list is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -14579,7 +16352,7 @@ "syntaxKind": "GetAccessor", "name": "values", "value": "string[]", - "description": "An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected." + "description": "The values of the currently selected choices." }, { "filePath": "src/surfaces/admin/components.ts", @@ -14608,11 +16381,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$3@11434", + "name": "__@internals$3@16769", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -14642,7 +16422,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -14650,38 +16430,52 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ChoiceList extends BaseClass$3 implements ChoiceListProps {\n accessor disabled: ChoiceListProps['disabled'];\n accessor name: ChoiceListProps['name'];\n accessor error: ChoiceListProps['error'];\n accessor details: ChoiceListProps['details'];\n accessor multiple: ChoiceListProps['multiple'];\n accessor label: ChoiceListProps['label'];\n accessor labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class ChoiceList extends BaseClass$1 implements ChoiceListProps {\n /**\n * Wraps change and input event listeners so they only fire when the event\n * was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n *\n * This prevents form events from elements inside secondary content (e.g.\n * TextField, native ) from being mistakenly treated as ChoiceList\n * value-change events, while still allowing those events to bubble normally\n * through the DOM (preserving React's event delegation).\n * @private\n */\n addEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n\n /** @private */\n removeEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: EventListenerOptions | boolean,\n ): void;\n\n /**\n * Whether all choices in the list are disabled and can't be selected.\n */\n disabled: ChoiceListProps['disabled'];\n /**\n * The name that identifies this choice list when the form is submitted.\n */\n name: ChoiceListProps['name'];\n /**\n * An error message that's displayed below the choice list when validation fails.\n */\n error: ChoiceListProps['error'];\n /**\n * Additional text to provide context or guidance for the choice list.\n */\n details: ChoiceListProps['details'];\n /**\n * Whether users can select more than one choice at a time.\n */\n multiple: ChoiceListProps['multiple'];\n /**\n * The text that describes what the choice list is for.\n */\n label: ChoiceListProps['label'];\n /**\n * Controls whether the label is visible to all users or only to screen readers.\n */\n labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n /**\n * The values of the currently selected choices.\n */\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "Clickable": { "filePath": "src/surfaces/admin/components.ts", "name": "Clickable", - "description": "Configure the following properties on the clickable component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the component is disabled, preventing clicks and focus. When disabled, the `click` event won't fire and click events from child elements stop propagating immediately. Interactive child elements can still receive focus and be interacted with. This doesn't apply visual styling by default. You shouldapply disabled styling as needed." + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the component is in a loading state, which indicates to assistive technology that an action is in progress and prevents interaction." + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -14689,21 +16483,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "defaultValue": "'button'" }, { @@ -14711,7 +16505,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -14719,7 +16513,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -14727,7 +16521,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -14735,7 +16529,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -14743,7 +16537,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -14751,7 +16545,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -14759,7 +16553,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -14767,7 +16561,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -14775,7 +16569,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -14783,7 +16577,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -14791,7 +16585,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -14799,7 +16593,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -14807,7 +16601,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -14815,7 +16609,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -14823,7 +16617,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -14831,7 +16625,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -14839,7 +16633,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -14859,7 +16653,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -14867,7 +16661,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -14875,7 +16669,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -14883,7 +16677,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -14891,14 +16685,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -14906,9 +16700,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -14954,7 +16755,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -14962,15 +16763,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -14978,30 +16794,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n accessor disabled: ClickableProps['disabled'];\n accessor loading: ClickableProps['loading'];\n accessor target: ClickableProps['target'];\n accessor href: ClickableProps['href'];\n accessor download: ClickableProps['download'];\n accessor type: ClickableProps['type'];\n constructor();\n}" + "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n disabled: ClickableProps['disabled'];\n loading: ClickableProps['loading'];\n target: ClickableProps['target'];\n href: ClickableProps['href'];\n download: ClickableProps['download'];\n type: ClickableProps['type'];\n constructor();\n}" }, "ClickableChip": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChip", - "description": "Configure the following properties on the clickable chip component.", - "isPublicDocs": true, + "description": "A custom element for displaying interactive chips that can be clicked or removed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "The color of the chip.", "defaultValue": "'base'" }, { @@ -15009,14 +16824,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the chip for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "removable", "value": "boolean", - "description": "Whether the chip displays a remove button for dismissal. When clicked, the `remove` callback fires.", + "description": "Whether the chip can be removed by the user.", "defaultValue": "false" }, { @@ -15024,7 +16839,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Whether the chip is hidden from view. When using controlled component pattern with `removable` chips, update this property when the `remove` event fires. For non-removable chips, manually toggle this property to show or hide the chip.", + "description": "Whether the chip is hidden from view.", "defaultValue": "false" }, { @@ -15032,7 +16847,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the chip is disabled, preventing any user interaction.", + "description": "Whether the chip is disabled and can't be clicked.", "defaultValue": "false" }, { @@ -15040,7 +16855,14 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to navigate to when the chip is clicked." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -15087,7 +16909,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -15095,15 +16917,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -15111,30 +16948,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class ClickableChip\n extends ClickableChip_base\n implements ClickableChipProps\n{\n accessor color: ClickableChipProps['color'];\n accessor accessibilityLabel: ClickableChipProps['accessibilityLabel'];\n accessor removable: ClickableChipProps['removable'];\n accessor hidden: ClickableChipProps['hidden'];\n accessor disabled: ClickableChipProps['disabled'];\n accessor href: ClickableChipProps['href'];\n constructor();\n}" + "value": "declare class ClickableChip\n extends ClickableChipBase\n implements ClickableChipProps\n{\n /**\n * The color of the chip.\n */\n color: ClickableChipProps['color'];\n constructor();\n}" }, "ColorField": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorField", - "description": "Configure the following properties on the color field component.", - "isPublicDocs": true, + "description": "The color field custom element class that renders a color input field with integrated visual picker in the Shopify admin interface. This component allows merchants to select colors by typing hex values or using an interactive color picker, with optional support for transparency (alpha channel).", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -15142,7 +16978,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", @@ -15165,7 +17001,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\"", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -15173,35 +17009,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -15209,14 +17045,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -15224,7 +17060,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -15248,7 +17084,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -15264,7 +17100,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -15272,23 +17108,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -15326,7 +17169,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -15334,24 +17177,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ColorField\n extends PreactFieldElement\n implements ColorFieldProps\n{\n accessor alpha: ColorFieldProps['alpha'];\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n setInternalValue(value: string, normalize: boolean): void;\n}" + "value": "declare class ColorField extends ColorFieldBase implements ColorFieldProps {\n constructor();\n}" }, "ColorPicker": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorPicker", - "description": "Configure the following properties on the color picker component.", - "isPublicDocs": true, + "description": "A visual color picker component that allows users to select colors from a color spectrum interface.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -15359,154 +17216,138 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial color value when the field first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts interacting, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", "name": "formResetCallback", "value": "() => void", - "description": "A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@internals$2@11535", - "value": "ElementInternals", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", "description": "", "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true } ], - "value": "declare class ColorPicker extends BaseClass$2 implements ColorPickerProps {\n accessor alpha: boolean;\n accessor name: string;\n accessor defaultValue: string;\n get value(): string;\n set value(value: string);\n /**\n * A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`.\n */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class ColorPicker extends BaseClass implements ColorPickerProps {\n /**\n * Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.\n *\n * @default false\n */\n alpha: boolean;\n /**\n * The name of the picker, used when submitting form data.\n */\n name: string;\n /**\n * The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n defaultValue: string;\n /**\n * The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n}" }, "DateField": { "filePath": "src/surfaces/admin/components.ts", "name": "DateField", - "description": "Configure the following properties on the date field component.", - "isPublicDocs": true, + "description": "The date field custom element class that renders a date input field with integrated calendar picker in the Shopify admin interface. This component allows merchants to select dates by typing or using a visual calendar, with support for date range restrictions and day-of-week constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar picker, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar picker first opens, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "DateAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -15514,36 +17355,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "defaultValue": "\"\"" + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -15551,14 +17391,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -15566,7 +17406,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -15590,7 +17430,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -15614,7 +17454,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -15622,31 +17462,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected date in `YYYY-MM-DD` format. An empty string means no date is selected.", - "defaultValue": "\"\"" + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -15684,7 +17530,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -15692,78 +17538,139 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DateField\n extends PreactFieldElement\n implements DateFieldProps\n{\n accessor allow: DateFieldProps['allow'];\n accessor disallow: DateFieldProps['disallow'];\n accessor allowDays: DateFieldProps['allowDays'];\n accessor disallowDays: DateFieldProps['disallowDays'];\n set view(view: string);\n get view(): string;\n accessor defaultView: DateFieldProps['defaultView'];\n constructor();\n}" + "value": "declare class DateField extends DateFieldBase implements DateFieldProps {\n constructor();\n}" }, "DateAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "DateAutocompleteField", "value": "'bday-day' | 'bday-month' | 'bday-year' | 'bday' | 'cc-expiry-month' | 'cc-expiry-year' | 'cc-expiry'", - "description": "Represents autocomplete values that are valid for date input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for date-based inputs.\n\nAvailable values:\n- `bday` - Complete birthday date\n- `bday-day` - Day component of a birthday (1-31)\n- `bday-month` - Month component of a birthday (1-12)\n- `bday-year` - Year component of a birthday (1990)\n- `cc-expiry` - Complete credit card expiration date\n- `cc-expiry-month` - Month component of a credit card expiration date (1-12)\n- `cc-expiry-year` - Year component of a credit card expiration date (2025)", - "isPublicDocs": true + "description": "" }, "DatePicker": { "filePath": "src/surfaces/admin/components.ts", "name": "DatePicker", - "description": "Configure the following properties on the date picker component.", - "isPublicDocs": true, + "description": "The date picker custom element class that renders a standalone calendar interface in the Shopify admin. This component allows merchants to select single dates or date ranges using an interactive calendar with month/year navigation, date constraints, and day-of-week restrictions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar first renders, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"single\" | \"range\"", - "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "description": "The type of date selection allowed. Available values: `single`, `range`.", "defaultValue": "\"single\"" }, { @@ -15771,7 +17678,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initially selected date(s) when the component first renders. An empty string means no date is initially selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The initial selected date or date range when the picker first renders, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -15779,14 +17686,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "value", "value": "string", - "description": "The currently selected date(s). An empty string means no date is selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The currently selected date or date range, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -15800,19 +17707,26 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@dirtyStateSymbol@11579", - "value": "boolean", + "name": "__@internals$1@16931", + "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$1@11578", - "value": "ElementInternals", + "name": "__@dirtyStateSymbol@16932", + "value": "boolean", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -15858,7 +17772,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -15866,17 +17780,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DatePicker extends BaseClass$1 implements DatePickerProps {\n accessor defaultView: string;\n set view(view: string);\n get view(): string;\n accessor allow: DatePickerProps['allow'];\n accessor disallow: DatePickerProps['disallow'];\n accessor allowDays: DatePickerProps['allowDays'];\n accessor disallowDays: DatePickerProps['disallowDays'];\n accessor type: DatePickerProps['type'];\n accessor defaultValue: DatePickerProps['defaultValue'];\n accessor name: DatePickerProps['name'];\n set value(value: string);\n get value(): string;\n /** @private */\n [dirtyStateSymbol]: boolean;\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DatePicker\n extends DatePickerBase\n implements DatePickerProps\n{\n constructor();\n}" }, "DropZone": { "filePath": "src/surfaces/admin/components.ts", "name": "DropZone", - "description": "Configure the following properties on the drop zone component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -15898,29 +17826,29 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -15936,14 +17864,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -15973,7 +17901,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@setFiles@11614", + "name": "__@setFiles@16968", "value": "(files: File[]) => void", "description": "", "isPrivate": true @@ -15981,7 +17909,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@getFileInput@11616", + "name": "__@getFileInput@16970", "value": "() => HTMLInputElement", "description": "", "isPrivate": true @@ -15989,11 +17917,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals@11615", + "name": "__@internals@16969", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -16039,7 +17974,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -16047,17 +17982,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DropZone extends BaseClass implements DropZoneProps {\n accessor accept: DropZoneProps['accept'];\n accessor accessibilityLabel: DropZoneProps['accessibilityLabel'];\n accessor disabled: DropZoneProps['disabled'];\n accessor error: DropZoneProps['error'];\n accessor label: DropZoneProps['label'];\n accessor labelAccessibilityVisibility: DropZoneProps['labelAccessibilityVisibility'];\n accessor multiple: DropZoneProps['multiple'];\n accessor name: DropZoneProps['name'];\n accessor required: DropZoneProps['required'];\n get value(): string;\n /** This sets the input value for a file type, which cannot be set programatically, so it can only be reset. */\n set value(value: '' | null);\n get files(): File[];\n set files(files: File[]);\n /** @private */\n [setFiles](files: File[]): void;\n /** @private */\n [getFileInput](): ReplaceType<\n Element | null | undefined,\n Element,\n HTMLInputElement\n >;\n\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DropZone extends DropZoneBase implements DropZoneProps {\n constructor();\n}" }, "Divider": { "filePath": "src/surfaces/admin/components.ts", "name": "Divider", - "description": "Configure the following properties on the divider component.", - "isPublicDocs": true, + "description": "A divider is a visual separator that creates a line between different sections of content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -16075,6 +18024,13 @@ "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -16120,7 +18076,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -16128,32 +18084,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Divider extends PreactCustomElement implements DividerProps {\n accessor direction: DividerProps['direction'];\n accessor color: DividerProps['color'];\n constructor();\n}" + "value": "declare class Divider extends PolarisCustomElement implements DividerProps {\n /**\n * The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n *\n * - `inline`: Horizontal divider for separating vertically stacked content\n * - `block`: Vertical divider for separating horizontally arranged content\n *\n * @default 'inline'\n */\n direction: DividerProps['direction'];\n /**\n * The visual prominence of the divider line.\n *\n * - `base`: Standard divider for most separations (default)\n * - `strong`: More prominent divider for major section breaks\n *\n * @default 'base'\n */\n color: DividerProps['color'];\n constructor();\n}" }, "EmailField": { "filePath": "src/surfaces/admin/components.ts", "name": "EmailField", - "description": "Configure the following properties on the email field component.", - "isPublicDocs": true, + "description": "The email field custom element class that renders an email input field in the Shopify admin interface. This component allows merchants to enter email addresses with automatic validation and optimized mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | EmailAutocompleteField | `section-${string} email` | `section-${string} home email` | `section-${string} mobile email` | `section-${string} fax email` | `section-${string} pager email` | \"shipping email\" | \"shipping home email\" | \"shipping mobile email\" | \"shipping fax email\" | \"shipping pager email\" | \"billing email\" | \"billing home email\" | \"billing mobile email\" | \"billing fax email\" | \"billing pager email\" | `section-${string} shipping email` | `section-${string} shipping home email` | `section-${string} shipping mobile email` | `section-${string} shipping fax email` | `section-${string} shipping pager email` | `section-${string} billing email` | `section-${string} billing home email` | `section-${string} billing mobile email` | `section-${string} billing fax email` | `section-${string} billing pager email`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint as to the intended content of the field for autocomplete purposes.", + "defaultValue": "'email'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -16161,50 +18131,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -16212,14 +18175,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -16227,7 +18190,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -16251,7 +18214,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -16275,7 +18238,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -16283,23 +18246,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -16337,7 +18314,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -16345,32 +18322,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class EmailField\n extends PreactFieldElement\n implements EmailFieldProps\n{\n accessor autocomplete: EmailFieldProps['autocomplete'];\n accessor maxLength: EmailFieldProps['maxLength'];\n accessor minLength: EmailFieldProps['minLength'];\n /**\n * The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class EmailField extends EmailFieldBase implements EmailFieldProps {\n constructor();\n}" }, "EmailAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "EmailAutocompleteField", "value": "'email' | 'home email' | 'mobile email' | 'fax email' | 'pager email'", - "description": "Represents autocomplete values that are valid for email input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for email inputs.\n\nAvailable values:\n- `email` - Primary email address\n- `home email` - Home email address\n- `mobile email` - Mobile device email address\n- `fax email` - Fax machine email address\n- `pager email` - Pager device email address", - "isPublicDocs": true + "description": "" }, "Grid": { "filePath": "src/surfaces/admin/components.ts", "name": "Grid", - "description": "Configure the following properties on the grid component.", - "isPublicDocs": true, + "description": "A grid is a layout component that arranges its children in rows and columns with precise control over sizing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridTemplateColumns", "value": "string", - "description": "The columns in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid columns.", "defaultValue": "'none'" }, { @@ -16378,7 +18368,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridTemplateRows", "value": "string", - "description": "The rows in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid rows.", "defaultValue": "'none'" }, { @@ -16386,7 +18376,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyItems", "value": "\"\" | JustifyItemsKeyword", - "description": "Aligns the grid items along the inline axis.", + "description": "The alignment of grid items along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -16394,7 +18384,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "\"\" | AlignItemsKeyword", - "description": "Aligns the grid items along the block axis.", + "description": "The alignment of grid items along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -16402,7 +18392,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeItems", "value": "AlignItemsKeyword | \"normal normal\" | \"normal stretch\" | \"normal baseline\" | \"normal first baseline\" | \"normal last baseline\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch baseline\" | \"stretch first baseline\" | \"stretch last baseline\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline baseline\" | \"baseline first baseline\" | \"baseline last baseline\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline baseline\" | \"first baseline first baseline\" | \"first baseline last baseline\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline baseline\" | \"last baseline first baseline\" | \"last baseline last baseline\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start baseline\" | \"start first baseline\" | \"start last baseline\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end baseline\" | \"end first baseline\" | \"end last baseline\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center baseline\" | \"center first baseline\" | \"center last baseline\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start baseline\" | \"unsafe start first baseline\" | \"unsafe start last baseline\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end baseline\" | \"unsafe end first baseline\" | \"unsafe end last baseline\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center baseline\" | \"unsafe center first baseline\" | \"unsafe center last baseline\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start baseline\" | \"safe start first baseline\" | \"safe start last baseline\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end baseline\" | \"safe end first baseline\" | \"safe end last baseline\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center baseline\" | \"safe center first baseline\" | \"safe center last baseline\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\"", - "description": "A shorthand property for `justify-items` and `align-items`.", + "description": "A shorthand for setting both `alignItems` and `justifyItems`.", "defaultValue": "'normal normal'" }, { @@ -16410,7 +18400,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "\"\" | JustifyContentKeyword", - "description": "Aligns the grid along the inline axis. This overrides the inline value of `placeContent`.", + "description": "The alignment of the grid along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -16418,7 +18408,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "\"\" | AlignContentKeyword", - "description": "Aligns the grid along the block axis. This overrides the block value of `placeContent`.", + "description": "The alignment of the grid along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -16426,7 +18416,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeContent", "value": "\"normal normal\" | \"normal stretch\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\" | AlignContentKeyword | \"normal space-between\" | \"normal space-around\" | \"normal space-evenly\" | \"baseline space-between\" | \"baseline space-around\" | \"baseline space-evenly\" | \"first baseline space-between\" | \"first baseline space-around\" | \"first baseline space-evenly\" | \"last baseline space-between\" | \"last baseline space-around\" | \"last baseline space-evenly\" | \"start space-between\" | \"start space-around\" | \"start space-evenly\" | \"end space-between\" | \"end space-around\" | \"end space-evenly\" | \"center space-between\" | \"center space-around\" | \"center space-evenly\" | \"unsafe start space-between\" | \"unsafe start space-around\" | \"unsafe start space-evenly\" | \"unsafe end space-between\" | \"unsafe end space-around\" | \"unsafe end space-evenly\" | \"unsafe center space-between\" | \"unsafe center space-around\" | \"unsafe center space-evenly\" | \"safe start space-between\" | \"safe start space-around\" | \"safe start space-evenly\" | \"safe end space-between\" | \"safe end space-around\" | \"safe end space-evenly\" | \"safe center space-between\" | \"safe center space-around\" | \"safe center space-evenly\" | \"stretch space-between\" | \"stretch space-around\" | \"stretch space-evenly\" | \"space-between normal\" | \"space-between start\" | \"space-between end\" | \"space-between center\" | \"space-between unsafe start\" | \"space-between unsafe end\" | \"space-between unsafe center\" | \"space-between safe start\" | \"space-between safe end\" | \"space-between safe center\" | \"space-between stretch\" | \"space-between space-between\" | \"space-between space-around\" | \"space-between space-evenly\" | \"space-around normal\" | \"space-around start\" | \"space-around end\" | \"space-around center\" | \"space-around unsafe start\" | \"space-around unsafe end\" | \"space-around unsafe center\" | \"space-around safe start\" | \"space-around safe end\" | \"space-around safe center\" | \"space-around stretch\" | \"space-around space-between\" | \"space-around space-around\" | \"space-around space-evenly\" | \"space-evenly normal\" | \"space-evenly start\" | \"space-evenly end\" | \"space-evenly center\" | \"space-evenly unsafe start\" | \"space-evenly unsafe end\" | \"space-evenly unsafe center\" | \"space-evenly safe start\" | \"space-evenly safe end\" | \"space-evenly safe center\" | \"space-evenly stretch\" | \"space-evenly space-between\" | \"space-evenly space-around\" | \"space-evenly space-evenly\"", - "description": "A shorthand property for `justify-content` and `align-content`.", + "description": "A shorthand for setting both `alignContent` and `justifyContent`.", "defaultValue": "'normal normal'" }, { @@ -16434,7 +18424,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows and columns.", "defaultValue": "'none'" }, { @@ -16442,7 +18432,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "s spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows.", "defaultValue": "'' - meaning no override" }, { @@ -16450,7 +18440,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid columns.", "defaultValue": "'' - meaning no override" }, { @@ -16458,7 +18448,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -16466,7 +18456,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -16474,7 +18464,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -16482,7 +18472,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -16490,7 +18480,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -16498,7 +18488,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -16506,7 +18496,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -16514,7 +18504,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -16522,7 +18512,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -16530,7 +18520,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -16538,7 +18528,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -16546,7 +18536,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -16554,7 +18544,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -16562,7 +18552,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -16570,7 +18560,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -16578,7 +18568,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -16586,7 +18576,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -16606,7 +18596,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -16614,7 +18604,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -16622,7 +18612,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -16630,7 +18620,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -16638,14 +18628,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -16653,9 +18643,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -16701,7 +18698,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -16709,96 +18706,101 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n accessor gridTemplateColumns: GridProps['gridTemplateColumns'];\n accessor gridTemplateRows: GridProps['gridTemplateRows'];\n accessor justifyItems: GridProps['justifyItems'];\n accessor alignItems: GridProps['alignItems'];\n accessor placeItems: GridProps['placeItems'];\n accessor justifyContent: GridProps['justifyContent'];\n accessor alignContent: GridProps['alignContent'];\n accessor placeContent: GridProps['placeContent'];\n accessor gap: GridProps['gap'];\n accessor rowGap: GridProps['rowGap'];\n accessor columnGap: GridProps['columnGap'];\n}" + "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n /**\n * The template that defines the grid columns.\n */\n gridTemplateColumns: GridProps['gridTemplateColumns'];\n /**\n * The template that defines the grid rows.\n */\n gridTemplateRows: GridProps['gridTemplateRows'];\n /**\n * The alignment of grid items along the inline axis.\n */\n justifyItems: GridProps['justifyItems'];\n /**\n * The alignment of grid items along the block axis.\n */\n alignItems: GridProps['alignItems'];\n /**\n * A shorthand for setting both `alignItems` and `justifyItems`.\n */\n placeItems: GridProps['placeItems'];\n /**\n * The alignment of the grid along the inline axis.\n */\n justifyContent: GridProps['justifyContent'];\n /**\n * The alignment of the grid along the block axis.\n */\n alignContent: GridProps['alignContent'];\n /**\n * A shorthand for setting both `alignContent` and `justifyContent`.\n */\n placeContent: GridProps['placeContent'];\n /**\n * The spacing between grid rows and columns.\n */\n gap: GridProps['gap'];\n /**\n * The spacing between grid rows.\n */\n rowGap: GridProps['rowGap'];\n /**\n * The spacing between grid columns.\n */\n columnGap: GridProps['columnGap'];\n}" }, "JustifyItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.\n\nLearn more about the [justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).", - "isPublicDocs": true + "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis." }, "BaselinePosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BaselinePosition", "value": "'baseline' | 'first baseline' | 'last baseline'", - "description": "Represents baseline alignment positions used to align items relative to their baselines.\n- `baseline`: Aligns to the baseline of the parent.\n- `first baseline`: Aligns to the first baseline of the parent.\n- `last baseline`: Aligns to the last baseline of the parent.", - "isPublicDocs": true + "description": "" }, "OverflowPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "OverflowPosition", "value": "`unsafe ${ContentPosition}` | `safe ${ContentPosition}`", - "description": "Represents content positioning with overflow behavior control. Use `safe` to prevent content from becoming inaccessible when it overflows, or `unsafe` to allow overflow regardless of accessibility.", - "isPublicDocs": true + "description": "" }, "ContentPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentPosition", "value": "'center' | 'start' | 'end'", - "description": "Defines the position of content along an axis.\n- `center`: Centers the content.\n- `start`: Aligns content to the start.\n- `end`: Aligns content to the end.", - "isPublicDocs": true + "description": "" }, "AlignItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Align items sets the align-self value on all direct children as a group.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isPublicDocs": true + "description": "Align items sets the align-self value on all direct children as a group." }, "JustifyContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyContentKeyword", "value": "'normal' | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", - "isPublicDocs": true + "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container." }, "ContentDistribution": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentDistribution", "value": "'space-between' | 'space-around' | 'space-evenly' | 'stretch'", - "description": "Defines how space is distributed between and around content items in flex and grid layouts.\n- `space-between`: Distributes items evenly with the first item at the start and last at the end.\n- `space-around`: Distributes items evenly with equal space around each item.\n- `space-evenly`: Distributes items evenly with equal space between them.\n- `stretch`: Stretches items to fill the container.", - "isPublicDocs": true + "description": "" }, "AlignContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignContentKeyword", "value": "'normal' | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isPublicDocs": true + "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis." }, "SpacingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SpacingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the spacing size between elements, using the standard size scale or `none` for no spacing.", - "isPublicDocs": true + "description": "" }, "GridItem": { "filePath": "src/surfaces/admin/components.ts", "name": "GridItem", - "description": "The grid item component represents a single cell within a grid layout, allowing you to control how content is positioned and sized within the grid. Use grid item as a child of grid to specify column span, row span, and positioning for individual content areas.\n\nGrid item supports precise placement control through column and row properties, enabling you to create complex layouts where different items occupy varying amounts of space or appear in specific grid positions.", - "isPublicDocs": true, + "description": "A grid item is a child of a grid that can be positioned within specific rows and columns.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridColumn", "value": "\"auto\" | `span ${number}`", - "description": "The number of columns the item will span across.\n\nLearn more about the [grid-column property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).", + "description": "The column position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -16806,7 +18808,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridRow", "value": "\"auto\" | `span ${number}`", - "description": "The number of rows the item will span across.\n\nLearn more about the [grid-row property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).", + "description": "The row position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -16814,7 +18816,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -16822,7 +18824,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -16830,7 +18832,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -16838,7 +18840,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -16846,7 +18848,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -16854,7 +18856,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -16862,7 +18864,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -16870,7 +18872,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -16878,7 +18880,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -16886,7 +18888,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -16894,7 +18896,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -16902,7 +18904,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -16910,7 +18912,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -16918,7 +18920,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -16926,7 +18928,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -16934,7 +18936,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -16942,7 +18944,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -16962,7 +18964,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -16970,7 +18972,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -16978,7 +18980,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -16986,7 +18988,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -16994,14 +18996,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -17009,9 +19011,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -17057,7 +19066,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -17065,24 +19074,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class GridItem extends BoxElement implements GridItemProps {\n accessor gridColumn: GridItemProps['gridColumn'];\n accessor gridRow: GridItemProps['gridRow'];\n constructor();\n}" + "value": "declare class GridItem extends BoxElement implements GridItemProps {\n /**\n * The column position and span of the grid item.\n */\n gridColumn: GridItemProps['gridColumn'];\n /**\n * The row position and span of the grid item.\n */\n gridRow: GridItemProps['gridRow'];\n constructor();\n}" }, "Heading": { "filePath": "src/surfaces/admin/components.ts", "name": "Heading", - "description": "Configure the following properties on the heading component.", - "isPublicDocs": true, + "description": "A custom element for displaying hierarchical section titles and headings with appropriate semantic meaning and visual styling. Use Heading to structure your content with proper heading levels for both visual hierarchy and accessibility.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"heading\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The ARIA role for the heading. Set to `'heading'` (the default) for standard heading semantics, or `'presentation'` / `'none'` to remove heading semantics for decorative use.", "defaultValue": "'heading'" }, { @@ -17090,7 +19113,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lineClamp", "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", "defaultValue": "Infinity - no truncation is applied" }, { @@ -17098,9 +19121,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -17146,7 +19176,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -17154,47 +19184,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Heading extends PreactCustomElement implements HeadingProps {\n accessor accessibilityRole: HeadingProps['accessibilityRole'];\n accessor lineClamp: HeadingProps['lineClamp'];\n accessor accessibilityVisibility: HeadingProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Heading extends HeadingBase implements HeadingProps {\n constructor();\n}" }, "Icon": { "filePath": "src/surfaces/admin/components.ts", "name": "Icon", - "description": "Configure the following properties on the icon component.", - "isPublicDocs": true, + "description": "An icon displays a graphical symbol from the icon library.", "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", + "description": "The color tone of the icon based on its semantic meaning.", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "The icon to display from the icon library.\n\nSet to a valid icon name to display that icon. To hide the icon completely, use an empty string `''`. To reserve the icon's space without displaying an icon, use `'empty'`." + "value": "\"\" | IconType", + "description": "The type of icon to display." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color emphasis of the icon.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"base\"", - "description": "The size of the icon.\n\n- `small`: Smaller icon suitable for inline use within text or compact UI elements.\n- `base`: Default size that works well for standalone icons and standard use cases.", + "description": "The size of the icon.", "defaultValue": "'base'" }, { @@ -17202,7 +19246,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The element that this icon should show interest for when activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -17249,7 +19300,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -17257,53 +19308,67 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Icon extends PreactCustomElement implements IconProps {\n accessor color: IconProps['color'];\n accessor tone: IconProps['tone'];\n accessor type: IconProps['type'];\n accessor size: IconProps['size'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Icon extends IconBase implements IconProps {\n /**\n * The color tone of the icon based on its semantic meaning.\n */\n tone: IconProps['tone'];\n /**\n * The type of icon to display.\n */\n type: IconProps['type'];\n constructor();\n}" }, "Image": { "filePath": "src/surfaces/admin/components.ts", "name": "Image", - "description": "Configure the following properties on the image component.", - "isPublicDocs": true, + "description": "An image displays pictures with configurable sizing, loading behavior, and borders.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "srcSet", "value": "string", - "description": "A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n\nLearn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset)." + "description": "A set of source images with different sizes for responsive loading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "sizes", "value": "string", - "description": "A set of media conditions and their corresponding sizes.\n\nLearn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes)." + "description": "The sizes of the image at different viewport widths." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "aspectRatio", "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", - "description": "The aspect ratio of the image.\n\nThe rendering of the image will depend on the `inlineSize` value:\n\n- `inlineSize=\"fill\"`: the aspect ratio will be respected and the image will take the necessary space.\n- `inlineSize=\"auto\"`: the image will not render until it has loaded and the aspect ratio will be ignored.\n\nFor example, if the value is set as `50 / 100`, the getter returns `50 / 100`. If the value is set as `0.5`, the getter returns `0.5 / 1`.\n\nLearn more about the [aspect-ratio property](https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio).", + "description": "The aspect ratio of the image as a width-to-height ratio.", "defaultValue": "'1/1'" }, { @@ -17311,7 +19376,7 @@ "syntaxKind": "PropertyDeclaration", "name": "objectFit", "value": "\"contain\" | \"cover\"", - "description": "The image resizing behavior to fit within its container.\n\n- `contain`: Scales the image to fit within the container while maintaining its aspect ratio. The entire image is visible, but might leave empty space.\n- `cover`: Scales the image to fill the entire container while maintaining its aspect ratio. The image might be cropped to fit.\n\nThe image is always positioned in the center of the container.\n\nLearn more about the [object-fit property](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).", + "description": "How the image should be resized to fit its container.", "defaultValue": "'contain'" }, { @@ -17319,7 +19384,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "\"eager\" | \"lazy\"", - "description": "The loading strategy for the image.\n\n- `eager`: Immediately loads the image, irrespective of its position within the visible viewport.\n- `lazy`: Delays loading the image until it approaches a specified distance from the viewport.\n\nLearn more about the [loading attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading).", + "description": "When the image should be loaded.", "defaultValue": "'eager'" }, { @@ -17327,7 +19392,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"img\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The accessibility role for the image.", "defaultValue": "'img'" }, { @@ -17335,7 +19400,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "\"auto\" | \"fill\"", - "description": "The displayed inline width of the image.\n\n- `fill`: the image will takes up 100% of the available inline size.\n- `auto`: the image will be displayed at its natural size.\n\nLearn more about the [width attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#width).", + "description": "The inline size (width in horizontal writing modes) of the image.", "defaultValue": "'fill'" }, { @@ -17343,35 +19408,23 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied around the image using shorthand syntax to specify width, color, and style in a single property.", - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "description": "Whether to show a border around the image.", + "defaultValue": "'none' - equivalent to `none base auto`." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderWidth", - "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderStyle", - "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image.", "defaultValue": "'' - meaning no override" }, { @@ -17379,17 +19432,161 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "The color of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the image's corners using the design system's radius scale.", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image.", "defaultValue": "'none'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Image extends PolarisCustomElement implements ImageProps {\n /**\n * The URL of the image to display.\n */\n src: ImageProps['src'];\n /**\n * A set of source images with different sizes for responsive loading.\n */\n srcSet: ImageProps['srcSet'];\n /**\n * The sizes of the image at different viewport widths.\n */\n sizes: ImageProps['sizes'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ImageProps['alt'];\n /**\n * The aspect ratio of the image as a width-to-height ratio.\n */\n aspectRatio: ImageProps['aspectRatio'];\n /**\n * How the image should be resized to fit its container.\n */\n objectFit: ImageProps['objectFit'];\n /**\n * When the image should be loaded.\n */\n loading: ImageProps['loading'];\n /**\n * The accessibility role for the image.\n */\n accessibilityRole: ImageProps['accessibilityRole'];\n /**\n * The inline size (width in horizontal writing modes) of the image.\n */\n inlineSize: ImageProps['inlineSize'];\n /**\n * Whether to show a border around the image.\n */\n border: ImageProps['border'];\n /**\n * The width of the border around the image.\n */\n borderWidth: ImageProps['borderWidth'];\n /**\n * The style of the border around the image.\n */\n borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image.\n */\n borderColor: ImageProps['borderColor'];\n /**\n * The radius of the border corners around the image.\n */\n borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + }, + "BorderRadiusKeyword": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "BorderRadiusKeyword", + "value": "SizeKeyword | 'max' | 'none'", + "description": "" + }, + "Link": { + "filePath": "src/surfaces/admin/components.ts", + "name": "Link", + "description": "", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "target", + "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", + "description": "Specifies where to display the linked URL.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -17435,7 +19632,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -17443,124 +19640,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Image extends PreactCustomElement implements ImageProps {\n accessor src: ImageProps['src'];\n accessor srcSet: ImageProps['srcSet'];\n accessor sizes: ImageProps['sizes'];\n accessor alt: ImageProps['alt'];\n accessor aspectRatio: ImageProps['aspectRatio'];\n accessor objectFit: ImageProps['objectFit'];\n accessor loading: ImageProps['loading'];\n accessor accessibilityRole: ImageProps['accessibilityRole'];\n accessor inlineSize: ImageProps['inlineSize'];\n /**\n * A border applied around the image using shorthand syntax to specify width, color, and style in a single property.\n */\n accessor border: ImageProps['border'];\n /**\n * The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.\n */\n accessor borderWidth: ImageProps['borderWidth'];\n /**\n * The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.\n */\n accessor borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.\n */\n accessor borderColor: ImageProps['borderColor'];\n /**\n * The roundedness of the image's corners using the design system's radius scale.\n */\n accessor borderRadius: ImageProps['borderRadius'];\n constructor();\n}" - }, - "Link": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Link", - "description": "Configure the following properties on the link component.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "href", - "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "target", - "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", - "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "download", - "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "lang", - "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", + "name": "__@flushRenderSymbol@16092", "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -17568,24 +19671,30 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Link extends Link_base implements LinkProps {\n accessor tone: LinkProps['tone'];\n accessor accessibilityLabel: LinkProps['accessibilityLabel'];\n accessor href: LinkProps['href'];\n accessor target: LinkProps['target'];\n accessor download: LinkProps['download'];\n accessor lang: LinkProps['lang'];\n constructor();\n}" + "value": "declare class Link extends LinkBase implements LinkProps {\n tone: LinkProps['tone'];\n constructor();\n}" }, "ListItem": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItem", - "description": "The list item component represents a single entry within an ordered list or unordered list. Use list item to structure individual points, steps, or items within a list, with each item automatically receiving appropriate list markers (bullets or numbers) from its parent list.\n\nList item must be used as a direct child of ordered list or unordered list components. Each list item can contain text, inline formatting, or other components to create rich list content.", - "isPublicDocs": true, + "description": "A component that represents a single item within an ordered list or unordered list.\n\nUse list item as a child of ordered list or unordered list to create properly structured and accessible list content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -17631,7 +19740,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -17639,24 +19748,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ListItem extends PreactCustomElement implements ListItemProps {\n constructor();\n}" + "value": "declare class ListItem extends PolarisCustomElement implements ListItemProps {\n constructor();\n}" }, "Menu": { "filePath": "src/surfaces/admin/components.ts", "name": "Menu", - "description": "Configure the following properties on the menu component.", - "isPublicDocs": true, + "description": "A component that displays a contextual list of actions or options, which is typically triggered by a button or other activator element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the menu for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", @@ -17677,7 +19800,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -17685,7 +19808,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -17693,11 +19816,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -17727,7 +19857,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -17735,24 +19865,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n accessor accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n /**\n * A label that describes the menu for assistive technologies.\n */\n accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "MoneyField": { "filePath": "src/surfaces/admin/components.ts", "name": "MoneyField", - "description": "Configure the following properties on the money field component.", - "isPublicDocs": true, + "description": "The money field custom element class that renders a monetary input field in the Shopify admin interface. This component allows merchants to enter currency amounts with automatic formatting, decimal precision, and validation against minimum and maximum values.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum monetary value allowed in the field.", "defaultValue": "Infinity" }, { @@ -17760,9 +19904,17 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum monetary value allowed in the field.", "defaultValue": "-Infinity" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "currencyCode", + "value": "\"auto\" | CurrencyCode", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -17775,7 +19927,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "string", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -17783,35 +19935,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -17819,14 +19971,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -17834,7 +19986,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -17858,7 +20010,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -17882,7 +20034,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -17890,23 +20042,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -17944,7 +20103,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -17952,17 +20111,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class MoneyField\n extends PreactFieldElement\n implements MoneyFieldProps\n{\n accessor max: MoneyFieldProps['max'];\n accessor min: MoneyFieldProps['min'];\n /**\n * The current monetary value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string representing the amount in the store's currency.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class MoneyField extends MoneyFieldBase implements MoneyFieldProps {\n constructor();\n}" + }, + "CurrencyCode": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CurrencyCode", + "value": "'USD' | 'EUR' | 'GBP' | 'CAD' | 'AFN' | 'ALL' | 'DZD' | 'AOA' | 'ARS' | 'AMD' | 'AWG' | 'AUD' | 'BBD' | 'AZN' | 'BDT' | 'BSD' | 'BHD' | 'BIF' | 'BZD' | 'BMD' | 'BTN' | 'BAM' | 'BRL' | 'BOB' | 'BWP' | 'BND' | 'BGN' | 'MMK' | 'KHR' | 'CVE' | 'KYD' | 'XAF' | 'CLP' | 'CNY' | 'COP' | 'KMF' | 'CDF' | 'CRC' | 'HRK' | 'CZK' | 'DKK' | 'DOP' | 'XCD' | 'EGP' | 'ETB' | 'XPF' | 'FJD' | 'GMD' | 'GHS' | 'GTQ' | 'GYD' | 'GEL' | 'HTG' | 'HNL' | 'HKD' | 'HUF' | 'ISK' | 'INR' | 'IDR' | 'ILS' | 'IQD' | 'JMD' | 'JPY' | 'JEP' | 'JOD' | 'KZT' | 'KES' | 'KWD' | 'KGS' | 'LAK' | 'LVL' | 'LBP' | 'LSL' | 'LRD' | 'LTL' | 'MGA' | 'MKD' | 'MOP' | 'MWK' | 'MVR' | 'MXN' | 'MYR' | 'MUR' | 'MDL' | 'MAD' | 'MNT' | 'MZN' | 'NAD' | 'NPR' | 'ANG' | 'NZD' | 'NIO' | 'NGN' | 'NOK' | 'OMR' | 'PAB' | 'PKR' | 'PGK' | 'PYG' | 'PEN' | 'PHP' | 'PLN' | 'QAR' | 'RON' | 'RUB' | 'RWF' | 'WST' | 'SAR' | 'RSD' | 'SCR' | 'SGD' | 'SDG' | 'SYP' | 'ZAR' | 'KRW' | 'SSP' | 'SBD' | 'LKR' | 'SRD' | 'SZL' | 'SEK' | 'CHF' | 'TWD' | 'THB' | 'TZS' | 'TTD' | 'TND' | 'TRY' | 'TMT' | 'UGX' | 'UAH' | 'AED' | 'UYU' | 'UZS' | 'VUV' | 'VND' | 'XOF' | 'YER' | 'ZMW' | 'BYN' | 'BYR' | 'DJF' | 'ERN' | 'FKP' | 'GIP' | 'GNF' | 'IRR' | 'KID' | 'LYD' | 'MRU' | 'SLL' | 'SHP' | 'SOS' | 'STD' | 'STN' | 'TJS' | 'TOP' | 'VED' | 'VEF' | 'VES' | 'XXX'", + "description": "" }, "NumberField": { "filePath": "src/surfaces/admin/components.ts", "name": "NumberField", - "description": "Configure the following properties on the number field component.", - "isPublicDocs": true, + "description": "The number field custom element class that renders a numeric input field in the Shopify admin interface. This component allows merchants to enter numbers with automatic validation and prefix/suffix display.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -17976,7 +20156,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inputMode", "value": "\"decimal\" | \"numeric\"", - "description": "The type of virtual keyboard to display on mobile devices.\n\n- `decimal`: Shows a numeric keyboard with a decimal point, suitable for prices or measurements.\n- `numeric`: Shows a numeric keyboard without a decimal point, suitable for whole numbers like quantities.\n\nLearn more about the [inputmode attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode).", + "description": "The input mode hint for mobile keyboards. Available values include:\n- `numeric`: Shows a numeric keypad optimized for entering numbers\n- `decimal`: Shows a numeric keypad with decimal point support\n- `tel`: Shows a telephone keypad", "defaultValue": "'decimal'" }, { @@ -17984,7 +20164,7 @@ "syntaxKind": "PropertyDeclaration", "name": "step", "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "description": "The granularity that the value must adhere to, or the keyword `any`. This controls the increment/decrement step size.", "defaultValue": "1" }, { @@ -17992,7 +20172,7 @@ "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum numeric value allowed in the field.", "defaultValue": "Infinity" }, { @@ -18000,7 +20180,7 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum numeric value allowed in the field.", "defaultValue": "-Infinity" }, { @@ -18008,7 +20188,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the user's input, such as a currency symbol.", "defaultValue": "''" }, { @@ -18016,7 +20196,7 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the user's input, such as a unit of measurement.", "defaultValue": "''" }, { @@ -18024,7 +20204,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | NumberAutocompleteField | `section-${string} one-time-code` | `section-${string} cc-number` | `section-${string} cc-csc` | \"shipping one-time-code\" | \"shipping cc-number\" | \"shipping cc-csc\" | \"billing one-time-code\" | \"billing cc-number\" | \"billing cc-csc\" | `section-${string} shipping one-time-code` | `section-${string} shipping cc-number` | `section-${string} shipping cc-csc` | `section-${string} billing one-time-code` | `section-${string} billing cc-number` | `section-${string} billing cc-csc`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -18032,35 +20212,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -18068,14 +20248,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -18083,7 +20263,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -18107,7 +20287,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -18131,7 +20311,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -18139,23 +20319,146 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class NumberField extends NumberFieldBase implements NumberFieldProps {\n constructor();\n}" + }, + "NumberAutocompleteField": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "NumberAutocompleteField", + "value": "'one-time-code' | 'cc-number' | 'cc-csc'", + "description": "" + }, + "Option": { + "filePath": "src/surfaces/admin/components.ts", + "name": "Option", + "description": "A single option within a select dropdown that users can choose.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "selected", + "value": "boolean", + "description": "Whether the option is currently selected.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "defaultSelected", + "value": "boolean", + "description": "Whether the option should be selected when it's first rendered.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "value", + "value": "string", + "description": "The value that's submitted with the form when this option is selected." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "disabled", + "value": "boolean", + "description": "Whether the option is disabled and can't be selected.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -18175,7 +20478,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", + "name": "connectedCallback", "value": "() => void", "description": "", "isPrivate": true @@ -18183,7 +20486,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", + "name": "disconnectedCallback", "value": "() => void", "description": "", "isPrivate": true @@ -18191,138 +20494,56 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "queueRender", + "name": "adoptedCallback", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - } - ], - "value": "declare class NumberField\n extends PreactFieldElement\n implements NumberFieldProps\n{\n /**\n * The current numeric value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string (decimal or integer).\n */\n get value(): string;\n set value(value: string);\n accessor inputMode: NumberFieldProps['inputMode'];\n accessor step: NumberFieldProps['step'];\n accessor max: NumberFieldProps['max'];\n accessor min: NumberFieldProps['min'];\n accessor prefix: NumberFieldProps['prefix'];\n accessor suffix: NumberFieldProps['suffix'];\n constructor();\n}" - }, - "NumberAutocompleteField": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "NumberAutocompleteField", - "value": "'one-time-code' | 'cc-number' | 'cc-csc'", - "description": "Represents autocomplete values that are valid for number input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for numeric inputs.\n\nAvailable values:\n- `one-time-code` - One-time codes for authentication (OTP, 2FA codes)\n- `cc-number` - Credit card number\n- `cc-csc` - Credit card security code (CVV/CVC)", - "isPublicDocs": true - }, - "Option": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Option", - "description": "Represents a single option within a select component. Use only as a child of s-select components.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "selected", - "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", - "defaultValue": "false" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "defaultSelected", - "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", - "defaultValue": "false" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "value", - "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", - "defaultValue": "false" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", + "name": "queueRender", "value": "() => void", - "description": "", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "queueRender", + "name": "__@flushRenderSymbol@16092", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Option extends PreactCustomElement implements OptionProps {\n accessor selected: OptionProps['selected'];\n accessor defaultSelected: OptionProps['defaultSelected'];\n accessor value: OptionProps['value'];\n accessor disabled: OptionProps['disabled'];\n constructor();\n}" + "value": "declare class Option extends PolarisCustomElement implements OptionProps {\n /**\n * Whether the option is currently selected.\n */\n selected: OptionProps['selected'];\n /**\n * Whether the option should be selected when it's first rendered.\n */\n defaultSelected: OptionProps['defaultSelected'];\n /**\n * The value that's submitted with the form when this option is selected.\n */\n value: OptionProps['value'];\n /**\n * Whether the option is disabled and can't be selected.\n */\n disabled: OptionProps['disabled'];\n constructor();\n}" }, "OptionGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionGroup", - "description": "Represents a group of options within a select component. Use only as a child of `s-select` components.", - "isPublicDocs": true, + "description": "A group of related options within a select dropdown, displayed with a label.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the options within this group can be selected or not.", + "description": "Whether all options in the group are disabled and can't be selected.", "defaultValue": "false" }, { @@ -18330,7 +20551,14 @@ "syntaxKind": "PropertyDeclaration", "name": "label", "value": "string", - "description": "The user-facing label for this group of options." + "description": "The text that describes what this group of options represents." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -18377,7 +20605,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -18385,18 +20613,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OptionGroup\n extends PreactCustomElement\n implements OptionGroupProps\n{\n accessor disabled: OptionGroupProps['disabled'];\n accessor label: OptionGroupProps['label'];\n constructor();\n}" + "value": "declare class OptionGroup\n extends PolarisCustomElement\n implements OptionGroupProps\n{\n /**\n * Whether all options in the group are disabled and can't be selected.\n */\n disabled: OptionGroupProps['disabled'];\n /**\n * The text that describes what this group of options represents.\n */\n label: OptionGroupProps['label'];\n constructor();\n}" }, "OrderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "OrderedList", - "description": "Configure the following properties on the ordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a numbered list of items with automatic numbering and proper list semantics. Use ordered list when the sequence or order of items matters, such as instructions, rankings, or step-by-step processes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -18442,7 +20691,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -18450,48 +20699,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OrderedList\n extends PreactCustomElement\n implements OrderedListProps\n{\n constructor();\n}" + "value": "declare class OrderedList\n extends PolarisCustomElement\n implements OrderedListProps\n{\n constructor();\n}" }, "Paragraph": { "filePath": "src/surfaces/admin/components.ts", "name": "Paragraph", - "description": "Configure the following properties on the paragraph component.", - "isPublicDocs": true, + "description": "A custom element for displaying blocks of text content with consistent spacing and styling for readable body copy. Use Paragraph to render longer text content with proper line height and spacing between paragraphs.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "lineClamp", - "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", - "defaultValue": "Infinity - no truncation is applied" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the paragraph text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"caution\"", - "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "lineClamp", + "value": "number", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", + "defaultValue": "Infinity - no truncation is applied" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color of the paragraph text.", "defaultValue": "'base'" }, { @@ -18499,7 +20762,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -18507,9 +20770,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -18555,7 +20825,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -18563,24 +20833,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Paragraph extends PreactCustomElement implements ParagraphProps {\n accessor fontVariantNumeric: ParagraphProps['fontVariantNumeric'];\n accessor lineClamp: ParagraphProps['lineClamp'];\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: ParagraphProps['tone'];\n\n accessor color: ParagraphProps['color'];\n accessor dir: ParagraphProps['dir'];\n accessor accessibilityVisibility: ParagraphProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Paragraph extends ParagraphBase implements ParagraphProps {\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: ParagraphProps['tone'];\n constructor();\n}" }, "PasswordField": { "filePath": "src/surfaces/admin/components.ts", "name": "PasswordField", - "description": "Configure the following properties on the password field component.", - "isPublicDocs": true, + "description": "The password field custom element class that renders a password input field in the Shopify admin interface. This component allows merchants to enter passwords securely with characters automatically masked for privacy.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the password.", "defaultValue": "Infinity" }, { @@ -18588,22 +20872,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the password.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | PasswordAutocompleteField | `section-${string} current-password` | `section-${string} new-password` | \"shipping current-password\" | \"shipping new-password\" | \"billing current-password\" | \"billing new-password\" | `section-${string} shipping current-password` | `section-${string} shipping new-password` | `section-${string} billing current-password` | `section-${string} billing new-password`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -18611,35 +20888,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -18647,14 +20924,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -18662,7 +20939,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -18686,7 +20963,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -18710,7 +20987,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -18718,23 +20995,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -18772,7 +21063,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -18780,34 +21071,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class PasswordField\n extends PreactFieldElement\n implements PasswordFieldProps\n{\n accessor maxLength: PasswordFieldProps['maxLength'];\n accessor minLength: PasswordFieldProps['minLength'];\n /**\n * The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class PasswordField\n extends PasswordFieldBase\n implements PasswordFieldProps\n{\n constructor();\n}" }, "PasswordAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PasswordAutocompleteField", "value": "'current-password' | 'new-password'", - "description": "Represents autocomplete values that are valid for password input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for password inputs.\n\nAvailable values:\n- `current-password` - Existing password for login or authentication\n- `new-password` - New password when creating an account or changing password", - "isPublicDocs": true + "description": "" }, "QueryContainer": { "filePath": "src/surfaces/admin/components.ts", "name": "QueryContainer", - "description": "Configure the following properties on the query container component.", - "isPublicDocs": true, + "description": "A component that sets up a container query context, which lets child elements style themselves based on the container's size instead of the viewport size.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "containerName", "value": "string", - "description": "An identifier for this container that you can reference in CSS container queries to apply styles based on this specific container's size.\n\nAll query container components automatically receive a container name of `s-default`. You can omit the container name in your queries, so `@container (inline-size <= 300px)` is equivalent to `@container s-default (inline-size <= 300px)`.\n\nWhen you provide a custom `containerName`, it's added alongside `s-default`. For example, `containerName=\"product-card\"` results in `s-default product-card` being set on the `container-name` CSS property, allowing you to target this container with `@container product-card (inline-size <= 300px)`.\n\nLearn more about the [container-name property](https://developer.mozilla.org/en-US/docs/Web/CSS/container-name).", + "description": "The name of the container, which you can reference in CSS container queries.", "defaultValue": "''" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -18853,7 +21164,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -18861,24 +21172,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class QueryContainer\n extends PreactCustomElement\n implements QueryContainerProps\n{\n accessor containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" + "value": "declare class QueryContainer\n extends PolarisCustomElement\n implements QueryContainerProps\n{\n /**\n * The name of the container, which you can reference in CSS container queries.\n */\n containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" }, "SearchField": { "filePath": "src/surfaces/admin/components.ts", "name": "SearchField", - "description": "Configure the following properties on the search field component.", - "isPublicDocs": true, + "description": "A search field that lets users enter search queries with a search-specific input type.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters that can be entered in the field.", "defaultValue": "Infinity" }, { @@ -18886,22 +21211,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters that must be entered for the field to be valid.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -18909,35 +21227,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -18945,14 +21263,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -18960,7 +21278,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -18984,7 +21302,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -19008,7 +21326,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -19016,23 +21334,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -19070,7 +21402,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -19078,25 +21410,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class SearchField\n extends PreactFieldElement\n implements SearchFieldProps\n{\n accessor maxLength: SearchFieldProps['maxLength'];\n accessor minLength: SearchFieldProps['minLength'];\n /**\n * The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class SearchField extends SearchFieldBase implements SearchFieldProps {\n constructor();\n}" }, "TextAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" }, "Section": { "filePath": "src/surfaces/admin/components.ts", "name": "Section", - "description": "Configure the following properties on the section component.", - "isPublicDocs": true, + "description": "A section is a container that groups related content together with an optional heading.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -19106,28 +21451,43 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "The accessibility label for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The heading text displayed at the top of the section. This heading provides a title for the section's content and automatically uses the appropriate semantic heading level (h2, h3, h4) based on nesting depth to maintain proper document structure." + "description": "The heading text for the section." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "\"base\" | \"none\"", - "description": "The padding applied to all edges of the element.\n\n- `base`: applies padding that is appropriate for the element. Note that it might result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the section need to span to the edge of the section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "description": "Whether the section has padding.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -19144,14 +21504,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -19165,7 +21517,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -19173,59 +21525,73 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Section extends PreactCustomElement implements SectionProps {\n constructor();\n /** @private */\n connectedCallback(): void;\n accessor accessibilityLabel: SectionProps['accessibilityLabel'];\n accessor heading: SectionProps['heading'];\n accessor padding: SectionProps['padding'];\n}" + "value": "declare class Section extends SectionBase implements SectionProps {\n constructor();\n}" }, "Select": { "filePath": "src/surfaces/admin/components.ts", "name": "Select", - "description": "Configure the following properties on the select component.", - "isPublicDocs": true, + "description": "A select dropdown that lets users choose one option from a list.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier." + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the select." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the select when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the select is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "Text that appears in the select when no option is selected to provide a hint about what to choose." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether an option must be selected before the form can be submitted.", "defaultValue": "false" }, { @@ -19233,7 +21599,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -19257,7 +21623,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component." + "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected Option component." }, { "filePath": "src/surfaces/admin/components.ts", @@ -19270,15 +21636,15 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@usedFirstOptionSymbol@12029", + "name": "__@usedFirstOptionSymbol@17470", "value": "boolean", - "description": "A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n\nThis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.", + "description": "used to determine if no value or defaultValue was set, in which case the first non-disabled option was used\n\nthis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@hasInitialValueSymbol@12030", + "name": "__@hasInitialValueSymbol@17471", "value": "boolean", "description": "", "isPrivate": true @@ -19288,7 +21654,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -19296,23 +21662,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -19342,7 +21715,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -19350,33 +21723,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Select extends PreactInputElement implements SelectProps {\n accessor icon: SelectProps['icon'];\n accessor details: SelectProps['details'];\n accessor error: SelectProps['error'];\n accessor label: SelectProps['label'];\n accessor placeholder: SelectProps['placeholder'];\n accessor required: SelectProps['required'];\n accessor labelAccessibilityVisibility: SelectProps['labelAccessibilityVisibility'];\n /** @private */\n connectedCallback(): void;\n /**\n * A lifecycle callback that fires when the component is removed from the DOM. Performs cleanup operations.\n * @private\n */\n disconnectedCallback(): void;\n constructor();\n /**\n * A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n *\n * This is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.\n * @private\n */\n [usedFirstOptionSymbol]: boolean;\n /**\n * @private\n */\n [hasInitialValueSymbol]: boolean;\n /**\n * The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component.\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n}" + "value": "declare class Select extends SelectBase implements SelectProps {\n constructor();\n}" }, "Spinner": { "filePath": "src/surfaces/admin/components.ts", "name": "Spinner", - "description": "Configure the following properties on the spinner component.", - "isPublicDocs": true, + "description": "A component that displays an animated loading indicator to show that content is currently being processed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the spinner for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the loading spinner.\n\n- `base`: Default size suitable for inline loading indicators or standard UI contexts.\n- `large`: Larger spinner for more prominent loading states.\n- `large-100`: Extra large spinner for full-page or emphasized loading states.", + "description": "The size of the spinner.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -19422,7 +21816,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -19430,24 +21824,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Spinner extends PreactCustomElement implements SpinnerProps {\n accessor accessibilityLabel: string;\n accessor size: SpinnerProps['size'];\n constructor();\n}" + "value": "declare class Spinner extends PolarisCustomElement implements SpinnerProps {\n /**\n * A label that describes the spinner for assistive technologies.\n */\n accessibilityLabel: string;\n /**\n * The size of the spinner.\n */\n size: SpinnerProps['size'];\n constructor();\n}" }, "Stack": { "filePath": "src/surfaces/admin/components.ts", "name": "Stack", - "description": "Configure the following properties on the stack component.", - "isPublicDocs": true, + "description": "A stack is a layout component that arranges its children in a single direction with controlled spacing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "direction", "value": "MaybeResponsive<\"inline\" | \"block\">", - "description": "The direction in which the stack's children are placed within the stack.\n\nAccepts:\n- A single value, either `inline` or `block`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported direction values as a query value", + "description": "The direction in which the stack's children are arranged.", "defaultValue": "'block'" }, { @@ -19455,7 +21863,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "JustifyContentKeyword", - "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -19463,7 +21871,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "AlignItemsKeyword", - "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -19471,7 +21879,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "AlignContentKeyword", - "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.", "defaultValue": "'normal'" }, { @@ -19479,7 +21887,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between the stack's children.", "defaultValue": "'none'" }, { @@ -19487,7 +21895,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between rows in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -19495,7 +21903,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between columns in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -19503,7 +21911,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -19511,7 +21919,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -19519,7 +21927,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -19527,7 +21935,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -19535,7 +21943,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -19543,7 +21951,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -19551,7 +21959,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -19559,7 +21967,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -19567,7 +21975,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -19575,7 +21983,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -19583,7 +21991,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -19591,7 +21999,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -19599,7 +22007,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -19607,7 +22015,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -19615,7 +22023,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -19623,7 +22031,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -19631,7 +22039,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -19651,7 +22059,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -19659,7 +22067,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -19667,7 +22075,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -19675,7 +22083,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -19683,14 +22091,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -19698,9 +22106,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -19746,7 +22161,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -19754,32 +22169,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n accessor direction: StackProps['direction'];\n accessor justifyContent: StackProps['justifyContent'];\n accessor alignItems: StackProps['alignItems'];\n accessor alignContent: StackProps['alignContent'];\n accessor gap: StackProps['gap'];\n accessor rowGap: StackProps['rowGap'];\n accessor columnGap: StackProps['columnGap'];\n}" + "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n /**\n * The direction in which the stack's children are arranged.\n */\n direction: StackProps['direction'];\n /**\n * Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n */\n justifyContent: StackProps['justifyContent'];\n /**\n * Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n */\n alignItems: StackProps['alignItems'];\n /**\n * Controls the distribution of lines along the block axis when content wraps into multiple lines.\n */\n alignContent: StackProps['alignContent'];\n /**\n * The spacing between the stack's children.\n */\n gap: StackProps['gap'];\n /**\n * The spacing between rows in the stack.\n */\n rowGap: StackProps['rowGap'];\n /**\n * The spacing between columns in the stack.\n */\n columnGap: StackProps['columnGap'];\n}" }, "Switch": { "filePath": "src/surfaces/admin/components.ts", "name": "Switch", - "description": "Configure the following properties on the switch component.", - "isPublicDocs": true, + "description": "A switch that lets users toggle a setting on or off with a sliding control.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -19794,7 +22230,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -19802,28 +22238,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -19846,7 +22282,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -19854,23 +22290,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -19916,7 +22359,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -19924,24 +22367,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Switch extends PreactCheckboxElement implements SwitchProps {\n accessor labelAccessibilityVisibility: SwitchProps['labelAccessibilityVisibility'];\n constructor();\n}" + "value": "declare class Switch extends SwitchBase implements SwitchProps {\n constructor();\n}" }, "Table": { "filePath": "src/surfaces/admin/components.ts", "name": "Table", - "description": "Configure the following properties on the table component.", - "isPublicDocs": true, + "description": "A component that displays data in a structured table format that automatically adapts to the available space.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "variant", "value": "\"auto\" | \"list\"", - "description": "The layout variant of the table component.\n\n- `list`: Always displays as a list layout.\n- `table`: Always displays as a traditional table layout.\n- `auto`: Automatically displays as a table on wide screens and as a list on narrow screens.", + "description": "The display variant of the table.", "defaultValue": "'auto'" }, { @@ -19949,7 +22406,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table. When `true`, the table might be in an inert state that prevents user interaction.", + "description": "Whether the table is currently in a loading state.", "defaultValue": "false" }, { @@ -19957,7 +22414,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paginate", "value": "boolean", - "description": "Whether to use pagination controls.", + "description": "Whether the pagination controls are displayed.", "defaultValue": "false" }, { @@ -19965,7 +22422,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hasPreviousPage", "value": "boolean", - "description": "Whether there's a previous page of data.", + "description": "Whether there's a previous page of data that the user can navigate to.", "defaultValue": "false" }, { @@ -19973,25 +22430,40 @@ "syntaxKind": "PropertyDeclaration", "name": "hasNextPage", "value": "boolean", - "description": "Whether there's an additional page of data.", + "description": "Whether there's a next page of data that the user can navigate to.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@actualTableVariantSymbol@12105", - "value": "AddedContext", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@actualTableVariantSymbol@17550", + "value": "_shopify_admin_web_component_foundations.AddedContext", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@tableHeadersSharedDataSymbol@12106", - "value": "AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", + "name": "__@tableHeadersSharedDataSymbol@17551", + "value": "_shopify_admin_web_component_foundations.AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -20037,7 +22509,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -20045,78 +22517,69 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Table extends PreactCustomElement implements TableProps {\n accessor variant: TableProps['variant'];\n accessor loading: TableProps['loading'];\n accessor paginate: TableProps['paginate'];\n accessor hasPreviousPage: TableProps['hasPreviousPage'];\n accessor hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" - }, - "AddedContext": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AddedContext", - "description": "", - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "T", - "description": "The current context value.\n\nThe new context value to set, which will notify all consumers." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "addEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", - "description": "The **`addEventListener()`** method of the EventTarget interface sets up a function that will be called whenever the specified event is delivered to the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener)" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "dispatchEvent", - "value": "(event: Event) => boolean", - "description": "The **`dispatchEvent()`** method of the EventTarget sends an Event to the object, (synchronously) invoking the affected event listeners in the appropriate order.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/dispatchEvent)" + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "removeEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", - "description": "The **`removeEventListener()`** method of the EventTarget interface removes an event listener previously registered with EventTarget.addEventListener() from the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/removeEventListener)" + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AddedContext extends EventTarget {\n constructor(defaultValue: T);\n /**\n * The current context value.\n */\n get value(): T;\n /**\n * The new context value to set, which will notify all consumers.\n */\n set value(value: T);\n}" + "value": "declare class Table extends PolarisCustomElement implements TableProps {\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The display variant of the table.\n */\n variant: TableProps['variant'];\n /**\n * Whether the table is currently in a loading state.\n */\n loading: TableProps['loading'];\n /**\n * Whether the pagination controls are displayed.\n */\n paginate: TableProps['paginate'];\n /**\n * Whether there's a previous page of data that the user can navigate to.\n */\n hasPreviousPage: TableProps['hasPreviousPage'];\n /**\n * Whether there's a next page of data that the user can navigate to.\n */\n hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: _shopify_admin_web_component_foundations.AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: _shopify_admin_web_component_foundations.AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" }, "ActualTableVariant": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ActualTableVariant", "value": "'table' | 'list'", - "description": "Represents the actual rendered variant of a table component.\n- `table`: Displays as a traditional table layout.\n- `list`: Displays as a list layout.", - "isPublicDocs": true + "description": "" }, "ListSlotType": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ListSlotType", "value": "'primary' | 'secondary' | 'kicker' | 'inline' | 'labeled'", - "description": "Represents the semantic type of content slots within list items.\n\n- `primary`: The main content or title of the list item.\n- `secondary`: Supporting or descriptive content below the primary content.\n- `kicker`: A small label or tag displayed above the primary content.\n- `inline`: Content displayed inline with the primary content.\n- `labeled`: Content with an associated label.", - "isPublicDocs": true + "description": "" }, "HeaderFormat": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true }, "TableBody": { "filePath": "src/surfaces/admin/components.ts", "name": "TableBody", - "description": "The table body component represents the main content area of a table, containing the data rows. Use table body as a child of table to structure your table data, with each table row within the body representing a single record or entry.\n\nTable body must contain table row components, which in turn contain table cell components for the actual data values.", - "isPublicDocs": true, + "description": "A component that wraps the body content of a table, which contains the data rows.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -20162,7 +22625,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -20170,26 +22633,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableBody extends PreactCustomElement implements TableBodyProps {\n constructor();\n}" + "value": "declare class TableBody extends PolarisCustomElement implements TableBodyProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n}" }, "TableCell": { "filePath": "src/surfaces/admin/components.ts", "name": "TableCell", - "description": "The table cell component represents a single data cell within a table row. Use table cell as a child of table row to display individual data values, with each cell corresponding to a column in the table.\n\nTable cell automatically inherits styling and alignment from its parent table structure and supports text content or other inline components.", - "isPublicDocs": true, + "description": "A component that represents a single cell in a table row, which displays data in a format that's determined by its column header.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", - "name": "__@headerFormatSymbol@12128", + "name": "__@headerFormatSymbol@17578", "value": "HeaderFormat", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -20235,7 +22727,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -20243,24 +22735,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableCell extends PreactCustomElement implements TableCellProps {\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" + "value": "declare class TableCell extends PolarisCustomElement implements TableCellProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" }, "TableHeader": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeader", - "description": "The table header component represents a single column header within a table header row. Use table header as a child of table header row to define column headings and optionally enable column sorting.\n\nTable header provides semantic meaning for screen readers and can include sorting controls when configured. Each header corresponds to a column in the table body.", - "isPublicDocs": true, + "description": "A component that defines a column header in a table, which specifies both the header label and how the column's data should be formatted.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "listSlot", "value": "ListSlotType", - "description": "The content designation for this column when the table displays in list variant on mobile devices.", + "description": "The slot where this header's data appears when the table is shown in list view.", "defaultValue": "'labeled'" }, { @@ -20268,7 +22774,22 @@ "syntaxKind": "PropertyDeclaration", "name": "format", "value": "HeaderFormat", - "description": "The format of the column that controls styling and alignment of cell content." + "description": "The format of the header and its corresponding cells." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -20315,7 +22836,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -20323,17 +22844,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeader\n extends PreactCustomElement\n implements TableHeaderProps\n{\n accessor listSlot: TableHeaderProps['listSlot'];\n accessor format: TableHeaderProps['format'];\n constructor();\n}" + "value": "declare class TableHeader\n extends PolarisCustomElement\n implements TableHeaderProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The slot where this header's data appears when the table is shown in list view.\n */\n listSlot: TableHeaderProps['listSlot'];\n /**\n * The format of the header and its corresponding cells.\n */\n format: TableHeaderProps['format'];\n constructor();\n}" }, "TableHeaderRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeaderRow", - "description": "The table header row component represents the header row of a table, containing column headings. Use table header row as the first child of table (before table body) to define the table structure and provide column labels.\n\nTable header row must contain table header components for each column. These headers provide context for the data columns and can support sorting functionality.", - "isPublicDocs": true, + "description": "A component that wraps the header row of a table, which contains the table header components that define the column structure.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -20353,59 +22888,18 @@ }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - } - ], - "value": "declare class TableHeaderRow\n extends PreactCustomElement\n implements TableHeaderRowProps\n{\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" - }, - "TableRow": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TableRow", - "description": "The table row component represents a single row of data within a table body. Use table row as a child of table body to structure individual records or entries in the table.\n\nTable row must contain table cell components, with each cell representing a data value for the corresponding column. The number of cells should match the number of headers in the table.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "clickDelegate", - "value": "string", - "description": "The ID of an interactive element, such as `s-link`, in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally." + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -20423,22 +22917,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -20452,7 +22930,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -20460,34 +22938,133 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableRow extends PreactCustomElement implements TableRowProps {\n constructor();\n accessor clickDelegate: string;\n}" + "value": "declare class TableHeaderRow\n extends PolarisCustomElement\n implements TableHeaderRowProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, - "Text": { + "TableRow": { "filePath": "src/surfaces/admin/components.ts", - "name": "Text", - "description": "Configure the following properties on the text component.", - "isPublicDocs": true, + "name": "TableRow", + "description": "A component that represents a single row in a table, which contains the data cells.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", - "defaultValue": "'auto'" + "name": "clickDelegate", + "value": "string", + "description": "A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class TableRow extends PolarisCustomElement implements TableRowProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /**\n * A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector.\n */\n clickDelegate: string;\n}" + }, + "Text": { + "filePath": "src/surfaces/admin/components.ts", + "name": "Text", + "description": "A custom element for displaying inline or small blocks of text with various visual styles and semantic meanings. Use Text to render short pieces of content with appropriate styling, emphasis, and color treatment.", + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", @@ -20496,6 +23073,22 @@ "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the text.", + "defaultValue": "'auto' - inherit from the parent element" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color of the text.", + "defaultValue": "'base'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", @@ -20509,7 +23102,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -20517,7 +23110,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, { @@ -20525,7 +23118,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The ID of an element this text provides contextual information for." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -20572,7 +23172,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -20580,24 +23180,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Text extends PreactCustomElement implements TextProps {\n accessor fontVariantNumeric: TextProps['fontVariantNumeric'];\n accessor color: TextProps['color'];\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: TextProps['tone'];\n /**\n * The semantic type and styling treatment for the text content.\n *\n * - `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n * - `generic`: Standard text with no special semantic meaning or styling.\n * - `address`: Marks the text as contact information, such as a physical or email address.\n * - `redundant`: Indicates the text is redundant or duplicated information for screen reader context.\n */\n accessor type: TextProps['type'];\n accessor dir: TextProps['dir'];\n accessor accessibilityVisibility: TextProps['accessibilityVisibility'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Text extends TextBase implements TextProps {\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: TextProps['tone'];\n constructor();\n}" }, "TextArea": { "filePath": "src/surfaces/admin/components.ts", "name": "TextArea", - "description": "Configure the following properties on the text area component.", - "isPublicDocs": true, + "description": "The text area custom element class that renders a multi-line text input field in the Shopify admin interface. This component allows merchants to enter and edit longer text content with support for labels, validation, and length constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -20605,7 +23219,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, { @@ -20613,22 +23227,15 @@ "syntaxKind": "PropertyDeclaration", "name": "rows", "value": "number", - "description": "A number of visible text lines.", + "description": "The number of visible text lines for the field, controlling its initial height.", "defaultValue": "2" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -20636,35 +23243,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -20672,14 +23279,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -20687,7 +23294,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -20711,7 +23318,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -20735,7 +23342,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -20743,23 +23350,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -20797,7 +23418,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -20805,24 +23426,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextArea\n extends PreactFieldElement\n implements TextAreaProps\n{\n accessor maxLength: TextAreaProps['maxLength'];\n accessor minLength: TextAreaProps['minLength'];\n accessor rows: TextAreaProps['rows'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextArea extends TextAreaBase implements TextAreaProps {\n constructor();\n}" }, "TextField": { "filePath": "src/surfaces/admin/components.ts", "name": "TextField", - "description": "Configure the following properties on the text field component.", - "isPublicDocs": true, + "description": "The text field custom element class that renders a single-line text input field in the Shopify admin interface. This component allows merchants to enter and edit text with support for labels, validation, icons, and prefix/suffix content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\" | AnyString", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "value": "IconType | AnyString", + "description": "An icon to display at the start of the text field, providing visual context for the input. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", "defaultValue": "''" }, { @@ -20830,7 +23465,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the merchant can enter in the field. When this limit is reached, the field prevents further input.", "defaultValue": "Infinity" }, { @@ -20838,7 +23473,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation. The field will be considered invalid if the merchant enters fewer characters than this value.", "defaultValue": "0" }, { @@ -20846,7 +23481,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the merchant's input, such as a currency symbol (`$`) or protocol (`https://`).", "defaultValue": "''" }, { @@ -20854,22 +23489,15 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the merchant's input, such as a unit of measurement (`kg`, `%`) or domain (`.myshopify.com`).", "defaultValue": "''" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -20877,35 +23505,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -20913,14 +23541,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -20928,7 +23556,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -20952,7 +23580,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -20976,7 +23604,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -20984,23 +23612,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -21038,7 +23680,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -21046,41 +23688,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextField\n extends PreactFieldElement\n implements TextFieldProps\n{\n accessor icon: TextFieldProps['icon'];\n accessor maxLength: TextFieldProps['maxLength'];\n accessor minLength: TextFieldProps['minLength'];\n accessor prefix: TextFieldProps['prefix'];\n accessor suffix: TextFieldProps['suffix'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextField extends TextFieldBase implements TextFieldProps {\n constructor();\n}" }, "Thumbnail": { "filePath": "src/surfaces/admin/components.ts", "name": "Thumbnail", - "description": "Configure the following properties on the thumbnail component.", - "isPublicDocs": true, + "description": "A thumbnail displays a small preview image with configurable sizing.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display in the thumbnail." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the product thumbnail image.\n\n- `small-200`: Smallest thumbnail size, ideal for compact product lists or tables.\n- `small-100`: Very small thumbnail, suitable for dense layouts.\n- `small`: Small thumbnail for space-constrained contexts.\n- `base`: Default size that balances visibility and space efficiency.\n- `large`: Larger thumbnail for featured products or detailed views.\n- `large-100`: Extra large thumbnail for prominent product display.", + "description": "The size of the thumbnail.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -21126,7 +23789,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -21134,22 +23797,36 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Thumbnail extends PreactCustomElement implements ThumbnailProps {\n accessor src: ThumbnailProps['src'];\n accessor alt: ThumbnailProps['alt'];\n accessor size: ThumbnailProps['size'];\n constructor();\n}" + "value": "declare class Thumbnail extends PolarisCustomElement implements ThumbnailProps {\n /**\n * The URL of the image to display in the thumbnail.\n */\n src: ThumbnailProps['src'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ThumbnailProps['alt'];\n /**\n * The size of the thumbnail.\n */\n size: ThumbnailProps['size'];\n constructor();\n}" }, "Tooltip": { "filePath": "src/surfaces/admin/components.ts", "name": "Tooltip", - "description": "Configure the following properties on the tooltip component.", - "isPublicDocs": true, + "description": "A component that displays a small popup with explanatory text when the user hovers over or focuses on an element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -21157,7 +23834,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -21165,11 +23842,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -21215,7 +23899,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -21223,8 +23907,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Tooltip extends PreactOverlayElement implements TooltipProps {\n constructor();\n}" @@ -21232,9 +23931,15 @@ "UnorderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "UnorderedList", - "description": "Configure the following properties on the unordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a bulleted list of items where the order doesn't matter. Use unordered list when you have a collection of related items without a specific sequence, such as features, options, or bullet points.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -21280,7 +23985,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -21288,32 +23993,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class UnorderedList\n extends PreactCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" + "value": "declare class UnorderedList\n extends PolarisCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" }, "URLField": { "filePath": "src/surfaces/admin/components.ts", "name": "URLField", - "description": "Configure the following properties on the URL field component.", - "isPublicDocs": true, + "description": "The URL field custom element class that renders a URL input field in the Shopify admin interface. This component allows merchants to enter web addresses with automatic URL validation and appropriate mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | `section-${string} url` | `section-${string} photo` | `section-${string} impp` | `section-${string} home impp` | `section-${string} mobile impp` | `section-${string} fax impp` | `section-${string} pager impp` | \"shipping url\" | \"shipping photo\" | \"shipping impp\" | \"shipping home impp\" | \"shipping mobile impp\" | \"shipping fax impp\" | \"shipping pager impp\" | \"billing url\" | \"billing photo\" | \"billing impp\" | \"billing home impp\" | \"billing mobile impp\" | \"billing fax impp\" | \"billing pager impp\" | `section-${string} shipping url` | `section-${string} shipping photo` | `section-${string} shipping impp` | `section-${string} shipping home impp` | `section-${string} shipping mobile impp` | `section-${string} shipping fax impp` | `section-${string} shipping pager impp` | `section-${string} billing url` | `section-${string} billing photo` | `section-${string} billing impp` | `section-${string} billing home impp` | `section-${string} billing mobile impp` | `section-${string} billing fax impp` | `section-${string} billing pager impp` | URLAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint about the intended content of the field for browser autofill.", + "defaultValue": "'url'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the URL.", "defaultValue": "Infinity" }, { @@ -21321,50 +24040,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the URL.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -21372,14 +24084,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -21387,7 +24099,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -21411,7 +24123,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -21435,7 +24147,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -21443,23 +24155,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -21497,7 +24223,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -21505,41 +24231,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class URLField\n extends PreactFieldElement\n implements URLFieldProps\n{\n accessor autocomplete: URLFieldProps['autocomplete'];\n accessor maxLength: URLFieldProps['maxLength'];\n accessor minLength: URLFieldProps['minLength'];\n /**\n * The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class URLField extends URLFieldBase implements URLFieldProps {\n constructor();\n}" }, "URLAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "URLAutocompleteField", "value": "'url' | 'photo' | 'impp' | 'home impp' | 'mobile impp' | 'fax impp' | 'pager impp'", - "description": "Represents autocomplete values that are valid for URL input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for URL inputs.\n\nAvailable values:\n- `url` - General URL or web address\n- `photo` - URL to a photo or image\n- `impp` - Instant messaging protocol URL\n- `home impp` - Home instant messaging protocol URL\n- `mobile impp` - Mobile instant messaging protocol URL\n- `fax impp` - Fax instant messaging protocol URL\n- `pager impp` - Pager instant messaging protocol URL", - "isPublicDocs": true + "description": "" }, "AdminAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminAction", - "description": "Configure the following properties on the admin action component.", - "isPublicDocs": true, + "description": "The admin action custom element class that renders action controls in the Shopify admin interface. This component creates a standardized action area with a heading and slots for primary and secondary action buttons, used exclusively in admin action extensions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text to use as the Action modal's title. If not provided, the name of the extension will be used." + "description": "The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the action is in a loading state, such as during initial page load or when the action is being opened. When `true`, the action might be in an inert state that prevents user interaction.", + "description": "Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -21585,7 +24331,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -21593,11 +24339,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminAction\n extends PreactCustomElement\n implements AdminActionProps\n{\n /**\n * The text to use as the Action modal's title. If not provided, the name of the extension will be used.\n */\n heading: string;\n /**\n * Whether the action is in a loading state, such as during initial page load or when the action is being opened.\n * When `true`, the action might be in an inert state that prevents user interaction.\n */\n loading: boolean;\n constructor();\n}" + "value": "declare class AdminAction\n extends PolarisCustomElement\n implements AdminActionProps\n{\n /**\n * The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading.\n */\n heading: string;\n /**\n * Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.\n *\n * @default false\n */\n loading: boolean;\n constructor();\n}" }, "RunnableExtension": { "filePath": "src/extension.ts", @@ -21703,22 +24464,28 @@ "AdminBlock": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminBlock", - "description": "Configure the following properties on the admin block component.", - "isPublicDocs": true, + "description": "The admin block custom element class that renders a collapsible content block in the Shopify admin interface. This component organizes content into expandable sections with headings and provides a summary when collapsed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text displayed as the block's title in the header. If not provided, the extension name will be used." + "description": "The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "collapsedSummary", "value": "string", - "description": "The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated." + "description": "The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -21765,7 +24532,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -21773,18 +24540,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminBlock\n extends PreactCustomElement\n implements AdminBlockProps\n{\n /**\n * The text displayed as the block's title in the header. If not provided, the extension name will be used.\n */\n heading: string;\n /**\n * The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated.\n */\n collapsedSummary: string;\n constructor();\n}" + "value": "declare class AdminBlock\n extends PolarisCustomElement\n implements AdminBlockProps\n{\n /**\n * The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed.\n */\n heading: string;\n /**\n * The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed.\n */\n collapsedSummary: string;\n constructor();\n}" }, "Form": { "filePath": "src/surfaces/admin/components.ts", "name": "Form", - "description": "Configure the following properties on the form component.", - "isPublicDocs": true, + "description": "The form custom element class that renders a form container in the Shopify admin interface. This component manages form submission, validation, and reset behavior for collecting merchant input.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -21830,7 +24618,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -21838,11 +24626,114 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Form extends PreactCustomElement implements FormProps {\n constructor();\n}" + "value": "declare class Form extends PolarisCustomElement implements FormProps {\n constructor();\n}" + }, + "IntentRenderApi": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderApi", + "description": "The `IntentRenderApi` object provides methods for extensions that render in response to an app intent. Access the intent data to determine what action the merchant requested and use `intents.response` to resolve the intent when complete.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "auth", + "value": "Auth", + "description": "Provides methods for authenticating calls to your app backend. Use the `idToken()` method to retrieve a signed JWT token that verifies the current user's identity for secure server-side operations." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "extension", + "value": "{ target: ExtensionTarget; }", + "description": "The identifier of the running extension target. Use this to determine which target your extension is rendering in and conditionally adjust functionality or UI based on the extension context." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "i18n", + "value": "I18n", + "description": "Utilities for translating content according to the current localization of the admin. Use these methods to provide translated strings that match the merchant's language preferences, ensuring your extension is accessible to a global audience." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "intents", + "value": "IntentRenderIntents", + "description": "Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "picker", + "value": "PickerApi", + "description": "Opens a custom selection dialog with your app-specific data. Use the [Picker API](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/picker-api) to define the picker's heading, items, headers, and selection behavior. Returns a Promise that resolves to a `Picker` object with a `selected` property for accessing the merchant's selection." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "query", + "value": "(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>", + "description": "Executes GraphQL queries against the [GraphQL Admin API](/docs/api/admin-graphql). Use this to fetch shop data, manage resources, or perform mutations. Queries are automatically authenticated with the current user's permissions. Optionally specify GraphQL variables and API version for your query." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "resourcePicker", + "value": "ResourcePickerApi", + "description": "Opens the [resource picker](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/resource-picker-api) modal for selecting products, variants, or collections. Returns the selected resources when the user confirms their selection, or undefined if they cancel." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "storage", + "value": "Storage", + "description": "Provides methods for persisting data in browser storage that is scoped to your extension. Use this to store user preferences, cache data, maintain state across sessions, or save temporary working data. Storage is persistent across page reloads and isolated per extension." + } + ], + "value": "export interface IntentRenderApi\n extends StandardRenderingExtensionApi {\n /**\n * Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow.\n */\n intents: IntentRenderIntents;\n}" + }, + "IntentRenderIntents": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderIntents", + "description": "The intents API available to intent render extensions. Unlike other targets where `response` is optional, intent render extensions always run inside an intent workflow so `response` is guaranteed.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled." + } + ], + "value": "export interface IntentRenderIntents {\n /**\n * Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled.\n */\n response: IntentResponseApi;\n}" + }, + "FormExtensionComponents": { + "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "FormExtensionComponents", + "value": "StandardComponents | 'Form'", + "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." }, "StandardApi": { "filePath": "src/surfaces/admin/api/standard/standard.ts", @@ -22524,19 +25415,18 @@ "value": "FormExtensionComponents | 'FunctionSettings'", "description": "The components available for building function settings extensions. Includes all form components plus the function settings component required for function settings configuration." }, - "FormExtensionComponents": { - "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "FormExtensionComponents", - "value": "StandardComponents | 'Form'", - "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." - }, "FunctionSettings": { "filePath": "src/surfaces/admin/components.ts", "name": "FunctionSettings", - "description": "Configure the following properties on the function settings component.", - "isPublicDocs": true, + "description": "The function settings custom element class that renders a specialized form for configuring Shopify Function settings in the admin interface. This component manages function configuration submission, validation, and error handling.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -22582,7 +25472,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -22590,8 +25480,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class FunctionSettings\n extends PreactCustomElement\n implements FunctionSettingsProps\n{\n constructor();\n}" @@ -22678,15 +25583,21 @@ "AdminPrintAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminPrintAction", - "description": "Configure the following properties on the admin print action component.", - "isPublicDocs": true, + "description": "The admin print action custom element class that renders a print interface in the Shopify admin. This component enables merchants to print content from a specified source URL using the browser's print functionality.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The `src` URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs, and images are supported." + "description": "The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -22733,7 +25644,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -22741,11 +25652,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminPrintAction\n extends PreactCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The `src` URL of the preview and the document to print.\n * If not provided, the preview will show an empty state and the print button will be disabled.\n * HTML, PDFs, and images are supported.\n */\n src: string;\n constructor();\n}" + "value": "declare class AdminPrintAction\n extends PolarisCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action.\n */\n src: string;\n constructor();\n}" }, "ProductDetailsConfigurationApi": { "filePath": "src/surfaces/admin/api/product-configuration/product-details-configuration.ts", @@ -24085,6 +27011,13 @@ "value": "RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >", "description": "A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options." }, + { + "filePath": "src/surfaces/admin/extension-targets.ts", + "syntaxKind": "PropertySignature", + "name": "admin.app.intent.render", + "value": "RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >", + "description": "Renders an admin extension for handling app intents." + }, { "filePath": "src/surfaces/admin/extension-targets.ts", "syntaxKind": "PropertySignature", @@ -24612,7 +27545,7 @@ "description": "A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules." } ], - "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n}" + "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n\n /**\n * Renders an admin extension for handling app intents.\n */\n 'admin.app.intent.render': RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >;\n}" }, "RenderExtension": { "filePath": "src/extension.ts", @@ -24802,9 +27735,17 @@ "value": "string | URL", "description": "The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.", + "isOptional": true } ], - "value": "export interface Intents {\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" + "value": "export interface Intents {\n /**\n * Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.\n */\n response?: IntentResponseApi;\n\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" }, "IntentInvokeApi": { "filePath": "src/surfaces/admin/api/intents/intents.ts", @@ -24814,6 +27755,67 @@ "members": [], "value": "export interface IntentInvokeApi {\n (query: IntentQuery): Promise;\n (intentURL: string, options?: IntentQueryOptions): Promise;\n}" }, + "IntentResponseApi": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "IntentResponseApi", + "description": "The `IntentResponseApi` object provides methods for resolving the current intent from within an invoked extension. This API is only present when your extension is running inside an intent workflow.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "closed", + "value": "() => Promise", + "description": "Resolves the current intent as closed without completing the workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "error", + "value": "(message: string, issues?: Issue[]) => Promise", + "description": "Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "ok", + "value": "(data?: { [key: string]: unknown; }) => Promise", + "description": "Resolves the current intent successfully. Pass output data when your intent defines a response schema." + } + ], + "value": "export interface IntentResponseApi {\n /**\n * Resolves the current intent successfully. Pass output data when your intent defines a response schema.\n */\n ok(data?: SuccessIntentResponse['data']): Promise;\n\n /**\n * Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available.\n */\n error(message: string, issues?: Issue[]): Promise;\n\n /**\n * Resolves the current intent as closed without completing the workflow.\n */\n closed(): Promise;\n}" + }, + "Issue": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "Issue", + "description": "A structured issue describing a validation or workflow error.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "code", + "value": "string", + "description": "A machine-readable error code for this issue. Use this for programmatic error handling or logging.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "message", + "value": "string", + "description": "A description of what's wrong with this field. Display this to help merchants understand how to fix the error.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "path", + "value": "string[]", + "description": "The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure.", + "isOptional": true + } + ], + "value": "export interface Issue {\n /** The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure. */\n path?: string[];\n /** A description of what's wrong with this field. Display this to help merchants understand how to fix the error. */\n message?: string;\n /** A machine-readable error code for this issue. Use this for programmatic error handling or logging. */\n code?: string;\n}" + }, "PickerApi": { "filePath": "src/surfaces/admin/api/picker/picker.ts", "name": "PickerApi", @@ -25307,29 +28309,28 @@ "Avatar": { "filePath": "src/surfaces/admin/components.ts", "name": "Avatar", - "description": "Configure the following properties on the avatar component.", - "isPublicDocs": true, + "description": "An avatar displays a user or entity image with fallback initials when the image isn't available.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "initials", "value": "string", - "description": "The initials to display in the avatar when no image is provided or fails to load. Typically one or two characters representing a person's first and last name initials, such as \"JD\" for John Doe." + "description": "The initials to display when no image is provided or if the image fails to load." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The URL or path to the avatar image. When provided, the image takes priority over `initials`. If the image fails to load or loads slowly, `initials` will be rendered as a fallback." + "description": "The URL of the avatar image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"base\" | \"large\" | \"large-200\"", - "description": "The size of the avatar image.\n\n- `small-200`: Extra small avatar, suitable for compact displays or lists with many items.\n- `small`: Small avatar, good for secondary contexts or tight layouts.\n- `base`: Default size that works well in most contexts.\n- `large`: Large avatar for emphasis or when the avatar is a focal point.\n- `large-200`: Extra large avatar for prominent display.", + "description": "The size of the avatar.", "defaultValue": "'base'" }, { @@ -25337,7 +28338,14 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the avatar for accessibility.\n\nProvides a text description of the avatar for users with assistive technology and serves as a fallback when the avatar fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an avatar, it reads this description aloud. When an avatar fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt)." + "description": "Alternative text that describes the avatar for screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -25384,7 +28392,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -25392,17 +28400,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Avatar extends PreactCustomElement implements AvatarProps {\n accessor initials: AvatarProps['initials'];\n accessor src: AvatarProps['src'];\n accessor size: AvatarProps['size'];\n accessor alt: AvatarProps['alt'];\n constructor();\n}" + "value": "declare class Avatar extends PolarisCustomElement implements AvatarProps {\n /**\n * The initials to display when no image is provided or if the image fails to load.\n */\n initials: AvatarProps['initials'];\n /**\n * The URL of the avatar image to display.\n */\n src: AvatarProps['src'];\n /**\n * The size of the avatar.\n */\n size: AvatarProps['size'];\n /**\n * Alternative text that describes the avatar for screen readers.\n */\n alt: AvatarProps['alt'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -25425,68 +28447,75 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred." + "description": "" } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" }, "Badge": { "filePath": "src/surfaces/admin/components.ts", "name": "Badge", - "description": "Configure the following properties on the badge component.", - "isPublicDocs": true, + "description": "The badge custom element class that renders status indicators in the Shopify admin interface. This component displays compact visual indicators with customizable tones, sizes, and optional icons to communicate status information to merchants.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"strong\"", - "description": "Controls the visual weight and emphasis of the badge.\n\n- `base`: Standard weight with moderate emphasis, suitable for most use cases.\n- `strong`: Increased visual weight for higher emphasis and prominence.", - "defaultValue": "'base'" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the badge to provide additional visual context or reinforce the badge's meaning. Accepts any icon name from the icon library or a custom string identifier." + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"strong\"", + "description": "The visual weight of the badge. Available options: `'base'` for standard weight or `'strong'` for increased emphasis.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the badge.\n\n- `base`: Default size suitable for most badge use cases.\n- `large`: Larger badge for increased visibility and prominence.\n- `large-100`: Extra large badge for maximum visibility in emphasized contexts.", + "description": "The size of the badge. Available options: `'base'` for standard size, `'large'` for larger size, or `'large-100'` for extra large size.", "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", - "defaultValue": "'auto'" + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -25533,7 +28562,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -25541,17 +28570,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Badge extends PreactCustomElement implements BadgeProps {\n accessor color: BadgeProps['color'];\n accessor icon: BadgeProps['icon'];\n accessor size: BadgeProps['size'];\n accessor tone: BadgeProps['tone'];\n constructor();\n}" + "value": "declare class Badge extends BadgeBase implements BadgeProps {\n /**\n * The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: BadgeProps['icon'];\n /**\n * The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.\n */\n tone: BadgeProps['tone'];\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "Banner": { "filePath": "src/surfaces/admin/components.ts", "name": "Banner", - "description": "Configure the following properties on the banner component.", - "isPublicDocs": true, + "description": "A custom element for displaying important messages and notifications.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -25566,7 +28616,7 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.", + "description": "The color tone of the banner based on its semantic meaning.", "defaultValue": "'auto'" }, { @@ -25574,7 +28624,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Controls whether the banner is visible or hidden.\n\nWhen using a controlled component pattern and the banner is `dismissible`, update this property to `true` when the `dismiss` event fires.\n\nYou can hide the banner programmatically by setting this to `true` even if it's not `dismissible`.", + "description": "Whether the banner is hidden from view.", "defaultValue": "false" }, { @@ -25582,9 +28632,16 @@ "syntaxKind": "PropertyDeclaration", "name": "dismissible", "value": "boolean", - "description": "Whether the banner displays a close button that allows users to dismiss it.\n\nWhen the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, any animation completes, and the `afterhide` event fires.", + "description": "Whether the banner can be dismissed by the user.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -25630,7 +28687,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -25638,24 +28695,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Banner extends PreactCustomElement implements BannerProps {\n accessor heading: BannerProps['heading'];\n accessor tone: BannerProps['tone'];\n accessor hidden: BannerProps['hidden'];\n accessor dismissible: BannerProps['dismissible'];\n constructor();\n}" + "value": "declare class Banner extends PolarisCustomElement implements BannerProps {\n /**\n * The heading text displayed at the top of the banner.\n */\n heading: BannerProps['heading'];\n /**\n * The color tone of the banner based on its semantic meaning.\n */\n tone: BannerProps['tone'];\n /**\n * Whether the banner is hidden from view.\n */\n hidden: BannerProps['hidden'];\n /**\n * Whether the banner can be dismissed by the user.\n */\n dismissible: BannerProps['dismissible'];\n constructor();\n}" }, "Box": { "filePath": "src/surfaces/admin/components.ts", "name": "Box", - "description": "Configure the following properties on the box component.", - "isPublicDocs": true, + "description": "A box is a container component that provides control over layout, spacing, and styling.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -25663,7 +28734,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -25671,7 +28742,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -25679,7 +28750,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -25687,7 +28758,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -25695,7 +28766,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -25703,7 +28774,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -25711,7 +28782,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -25719,7 +28790,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -25727,7 +28798,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -25735,7 +28806,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -25743,7 +28814,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -25751,7 +28822,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -25759,7 +28830,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -25767,7 +28838,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -25775,7 +28846,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -25783,7 +28854,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -25803,7 +28874,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -25811,7 +28882,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -25819,7 +28890,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -25827,7 +28898,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -25835,14 +28906,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -25850,9 +28921,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -25898,7 +28976,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -25906,8 +28984,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Box extends BoxElement implements BoxProps {\n constructor();\n}" @@ -25916,120 +29009,106 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -26037,60 +29116,60 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "Button": { "filePath": "src/surfaces/admin/components.ts", "name": "Button", - "description": "Configure the following properties on the button component.", - "isPublicDocs": true, + "description": "The button custom element class that renders interactive buttons in the Shopify admin interface. This component triggers actions or navigation when clicked, with customizable visual styles, states, and optional icons.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", - "defaultValue": "false" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier." + "name": "variant", + "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", + "description": "The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.", + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "loading", - "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", - "defaultValue": "false" + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "variant", - "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "defaultValue": "'auto'" + "name": "disabled", + "value": "boolean", + "description": "Whether the button is disabled, preventing any interaction. When `true`, the button appears visually disabled and doesn't respond to user clicks.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" + "name": "loading", + "value": "boolean", + "description": "Whether the button is in a loading state. When `true`, displays a loading indicator and prevents interaction to show that an action is in progress.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to open the linked document when the button acts as a link. Available options: `''`, `'_blank'`, `'_self'`, `'_parent'`, or `'_top'`.", "defaultValue": "'auto'" }, { @@ -26098,21 +29177,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "A URL that the button should navigate to when clicked. When provided, the button behaves as a link." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Prompts the user to save the linked URL as a file with the specified filename. Only works when `href` is provided." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The button's behavior in forms. Available options: `'button'`, `'submit'`, or `'reset'`.", "defaultValue": "'button'" }, { @@ -26120,7 +29199,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the button's purpose for screen readers. This is essential for accessibility when the button doesn't have visible text." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "inlineSize", + "value": "\"auto\" | \"fill\" | \"fit-content\"", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -26167,7 +29261,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -26175,15 +29269,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -26191,38 +29300,36 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Button extends Button_base implements ButtonProps {\n accessor disabled: ButtonProps['disabled'];\n accessor icon: ButtonProps['icon'];\n accessor loading: ButtonProps['loading'];\n accessor variant: ButtonProps['variant'];\n accessor tone: ButtonProps['tone'];\n accessor target: ButtonProps['target'];\n accessor href: ButtonProps['href'];\n accessor download: ButtonProps['download'];\n accessor type: ButtonProps['type'];\n accessor accessibilityLabel: ButtonProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Button\n extends ButtonBase\n implements ButtonProps\n{\n /**\n * The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: ButtonProps['icon'];\n /**\n * The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.\n */\n variant: ButtonProps['variant'];\n /**\n * The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.\n */\n tone: ButtonProps['tone'];\n constructor();\n}" }, "AnyString": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AnyString", "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true + "description": "Prevents widening string literal types in a union to `string`." }, "ButtonGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "ButtonGroup", - "description": "Configure the following properties on the button group component.", - "isPublicDocs": true, + "description": "A button group that arranges multiple buttons together with consistent spacing and semantic grouping for related actions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "\"base\" | \"none\"", - "description": "The spacing between buttons in the group.\n\n- `base`: Standard spacing that provides clear visual separation between buttons.\n- `none`: No spacing, creating a connected button group.", + "description": "The amount of spacing between buttons in the group, affecting the visual separation of actions.", "defaultValue": "'base'" }, { @@ -26230,7 +29337,21 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, describing the purpose of this group of buttons." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -26256,14 +29377,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -26277,7 +29390,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -26285,39 +29398,68 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ButtonGroup\n extends PreactCustomElement\n implements ButtonGroupProps\n{\n accessor gap: ButtonGroupProps['gap'];\n accessor accessibilityLabel: ButtonGroupProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class ButtonGroup extends ButtonGroupBase implements ButtonGroupProps {\n constructor();\n}" }, "Checkbox": { "filePath": "src/surfaces/admin/components.ts", "name": "Checkbox", - "description": "Configure the following properties on the checkbox component.", - "isPublicDocs": true, + "description": "A checkbox that lets users select or deselect an option, with support for an indeterminate state.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "indeterminate", "value": "boolean", - "description": "Whether the checkbox displays in an indeterminate state (neither checked nor unchecked), typically used to indicate partial selection in hierarchical lists.\n\nThis visual state takes priority over the `checked` prop in appearance only. The form submission value is still determined by the `checked` prop.\n\nIf `indeterminate` has not been explicitly set and hasn't been modified by user interaction, it returns the value of `defaultIndeterminate`." + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultIndeterminate", "value": "boolean", - "description": "The initial indeterminate state for uncontrolled components. Use this when you want the checkbox to start in an indeterminate state but don't need to control it afterward.\n\nThis value applies until `indeterminate` is explicitly set or the user changes the checkbox state by clicking.", + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "labelAccessibilityVisibility", + "value": "\"visible\" | \"exclusive\"", + "description": "", + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -26332,7 +29474,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -26340,28 +29482,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -26384,7 +29526,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -26392,23 +29534,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -26454,7 +29603,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -26462,24 +29611,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Checkbox extends PreactCheckboxElement implements CheckboxProps {\n get indeterminate(): CheckboxProps['indeterminate'];\n set indeterminate(indeterminate: CheckboxProps['indeterminate']);\n accessor defaultIndeterminate: CheckboxProps['defaultIndeterminate'];\n constructor();\n}" + "value": "declare class Checkbox extends CheckboxBase implements CheckboxProps {\n constructor();\n}" + }, + "CallbackEvent": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CallbackEvent", + "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." }, "Chip": { "filePath": "src/surfaces/admin/components.ts", "name": "Chip", - "description": "Configure the following properties on the chip component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "Modify the color to be more or less intense.", "defaultValue": "'base'" }, { @@ -26487,7 +29657,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -26534,7 +29719,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -26542,24 +29727,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Chip extends PreactCustomElement implements ChipProps {\n accessor color: ChipProps['color'];\n accessor accessibilityLabel: ChipProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Chip extends PolarisCustomElement implements ChipProps {\n color: ChipProps['color'];\n accessibilityLabel: ChipProps['accessibilityLabel'];\n removable: ChipProps['removable'];\n constructor(renderImpl?: Omit);\n}" }, "Choice": { "filePath": "src/surfaces/admin/components.ts", "name": "Choice", - "description": "The choice component creates individual selectable options within a choice list. Use choice to define each option that merchants can select, supporting both single selection (radio buttons) and multiple selection (checkboxes) modes.\n\nChoice components support labels, help text, and custom content through slots, providing flexible option presentation within choice lists.", - "isPublicDocs": true, + "description": "A single choice within a choice list that can be selected with a radio button or checkbox.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the choice is disabled and can't be selected.", "defaultValue": "false" }, { @@ -26567,7 +29766,7 @@ "syntaxKind": "GetAccessor", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the choice is currently selected.", "defaultValue": "false" }, { @@ -26575,21 +29774,21 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this choice is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, used when the visual label isn't descriptive enough." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the choice should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -26608,6 +29807,13 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -26637,7 +29843,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -26645,24 +29851,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Choice extends PreactCustomElement implements ChoiceProps {\n accessor disabled: ChoiceProps['disabled'];\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n accessor value: ChoiceProps['value'];\n accessor accessibilityLabel: ChoiceProps['accessibilityLabel'];\n accessor defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Choice extends PolarisCustomElement implements ChoiceProps {\n /**\n * Whether the choice is disabled and can't be selected.\n */\n disabled: ChoiceProps['disabled'];\n /**\n * Whether the choice is currently selected.\n */\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n /**\n * The value that's submitted with the form when this choice is selected.\n */\n value: ChoiceProps['value'];\n /**\n * A label that's only visible to screen readers, used when the visual label isn't descriptive enough.\n */\n accessibilityLabel: ChoiceProps['accessibilityLabel'];\n /**\n * Whether the choice should be selected when it's first rendered.\n */\n defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ChoiceList": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceList", - "description": "Configure the following properties on the choice list component.", - "isPublicDocs": true, + "description": "A list of choices that lets users select one or more options using radio buttons or checkboxes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "addEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", + "description": "Wraps change and input event listeners so they only fire when the event was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n\nThis prevents form events from elements inside secondary content (e.g. TextField, native ) from being mistakenly treated as ChoiceList value-change events, while still allowing those events to bubble normally through the DOM (preserving React's event delegation).", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "removeEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction. When `true`, the `disabled` property on any child choices is ignored.", + "description": "Whether all choices in the list are disabled and can't be selected.", "defaultValue": "false" }, { @@ -26670,43 +29906,43 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name that identifies this choice list when the form is submitted." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the choice list when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the choice list." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "multiple", "value": "boolean", - "description": "Whether multiple choices can be selected.", + "description": "Whether users can select more than one choice at a time.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the choice list is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -26714,7 +29950,7 @@ "syntaxKind": "GetAccessor", "name": "values", "value": "string[]", - "description": "An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected." + "description": "The values of the currently selected choices." }, { "filePath": "src/surfaces/admin/components.ts", @@ -26743,11 +29979,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$3@11434", + "name": "__@internals$3@16769", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -26777,7 +30020,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -26785,38 +30028,52 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ChoiceList extends BaseClass$3 implements ChoiceListProps {\n accessor disabled: ChoiceListProps['disabled'];\n accessor name: ChoiceListProps['name'];\n accessor error: ChoiceListProps['error'];\n accessor details: ChoiceListProps['details'];\n accessor multiple: ChoiceListProps['multiple'];\n accessor label: ChoiceListProps['label'];\n accessor labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class ChoiceList extends BaseClass$1 implements ChoiceListProps {\n /**\n * Wraps change and input event listeners so they only fire when the event\n * was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n *\n * This prevents form events from elements inside secondary content (e.g.\n * TextField, native ) from being mistakenly treated as ChoiceList\n * value-change events, while still allowing those events to bubble normally\n * through the DOM (preserving React's event delegation).\n * @private\n */\n addEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n\n /** @private */\n removeEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: EventListenerOptions | boolean,\n ): void;\n\n /**\n * Whether all choices in the list are disabled and can't be selected.\n */\n disabled: ChoiceListProps['disabled'];\n /**\n * The name that identifies this choice list when the form is submitted.\n */\n name: ChoiceListProps['name'];\n /**\n * An error message that's displayed below the choice list when validation fails.\n */\n error: ChoiceListProps['error'];\n /**\n * Additional text to provide context or guidance for the choice list.\n */\n details: ChoiceListProps['details'];\n /**\n * Whether users can select more than one choice at a time.\n */\n multiple: ChoiceListProps['multiple'];\n /**\n * The text that describes what the choice list is for.\n */\n label: ChoiceListProps['label'];\n /**\n * Controls whether the label is visible to all users or only to screen readers.\n */\n labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n /**\n * The values of the currently selected choices.\n */\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "Clickable": { "filePath": "src/surfaces/admin/components.ts", "name": "Clickable", - "description": "Configure the following properties on the clickable component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the component is disabled, preventing clicks and focus. When disabled, the `click` event won't fire and click events from child elements stop propagating immediately. Interactive child elements can still receive focus and be interacted with. This doesn't apply visual styling by default. You shouldapply disabled styling as needed." + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the component is in a loading state, which indicates to assistive technology that an action is in progress and prevents interaction." + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -26824,21 +30081,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "defaultValue": "'button'" }, { @@ -26846,7 +30103,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -26854,7 +30111,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -26862,7 +30119,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -26870,7 +30127,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -26878,7 +30135,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -26886,7 +30143,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -26894,7 +30151,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -26902,7 +30159,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -26910,7 +30167,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -26918,7 +30175,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -26926,7 +30183,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -26934,7 +30191,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -26942,7 +30199,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -26950,7 +30207,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -26958,7 +30215,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -26966,7 +30223,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -26974,7 +30231,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -26994,7 +30251,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -27002,7 +30259,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -27010,7 +30267,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -27018,7 +30275,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -27026,14 +30283,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -27041,9 +30298,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -27089,7 +30353,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -27097,15 +30361,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -27113,30 +30392,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n accessor disabled: ClickableProps['disabled'];\n accessor loading: ClickableProps['loading'];\n accessor target: ClickableProps['target'];\n accessor href: ClickableProps['href'];\n accessor download: ClickableProps['download'];\n accessor type: ClickableProps['type'];\n constructor();\n}" + "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n disabled: ClickableProps['disabled'];\n loading: ClickableProps['loading'];\n target: ClickableProps['target'];\n href: ClickableProps['href'];\n download: ClickableProps['download'];\n type: ClickableProps['type'];\n constructor();\n}" }, "ClickableChip": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChip", - "description": "Configure the following properties on the clickable chip component.", - "isPublicDocs": true, + "description": "A custom element for displaying interactive chips that can be clicked or removed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "The color of the chip.", "defaultValue": "'base'" }, { @@ -27144,14 +30422,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the chip for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "removable", "value": "boolean", - "description": "Whether the chip displays a remove button for dismissal. When clicked, the `remove` callback fires.", + "description": "Whether the chip can be removed by the user.", "defaultValue": "false" }, { @@ -27159,7 +30437,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Whether the chip is hidden from view. When using controlled component pattern with `removable` chips, update this property when the `remove` event fires. For non-removable chips, manually toggle this property to show or hide the chip.", + "description": "Whether the chip is hidden from view.", "defaultValue": "false" }, { @@ -27167,7 +30445,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the chip is disabled, preventing any user interaction.", + "description": "Whether the chip is disabled and can't be clicked.", "defaultValue": "false" }, { @@ -27175,7 +30453,14 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to navigate to when the chip is clicked." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -27222,7 +30507,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -27230,15 +30515,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -27246,30 +30546,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class ClickableChip\n extends ClickableChip_base\n implements ClickableChipProps\n{\n accessor color: ClickableChipProps['color'];\n accessor accessibilityLabel: ClickableChipProps['accessibilityLabel'];\n accessor removable: ClickableChipProps['removable'];\n accessor hidden: ClickableChipProps['hidden'];\n accessor disabled: ClickableChipProps['disabled'];\n accessor href: ClickableChipProps['href'];\n constructor();\n}" + "value": "declare class ClickableChip\n extends ClickableChipBase\n implements ClickableChipProps\n{\n /**\n * The color of the chip.\n */\n color: ClickableChipProps['color'];\n constructor();\n}" }, "ColorField": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorField", - "description": "Configure the following properties on the color field component.", - "isPublicDocs": true, + "description": "The color field custom element class that renders a color input field with integrated visual picker in the Shopify admin interface. This component allows merchants to select colors by typing hex values or using an interactive color picker, with optional support for transparency (alpha channel).", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -27277,7 +30576,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", @@ -27300,7 +30599,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\"", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -27308,35 +30607,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -27344,14 +30643,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -27359,7 +30658,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -27383,7 +30682,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -27399,7 +30698,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -27407,23 +30706,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -27461,7 +30767,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -27469,24 +30775,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ColorField\n extends PreactFieldElement\n implements ColorFieldProps\n{\n accessor alpha: ColorFieldProps['alpha'];\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n setInternalValue(value: string, normalize: boolean): void;\n}" + "value": "declare class ColorField extends ColorFieldBase implements ColorFieldProps {\n constructor();\n}" }, "ColorPicker": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorPicker", - "description": "Configure the following properties on the color picker component.", - "isPublicDocs": true, + "description": "A visual color picker component that allows users to select colors from a color spectrum interface.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -27494,154 +30814,138 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial color value when the field first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts interacting, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", "name": "formResetCallback", "value": "() => void", - "description": "A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@internals$2@11535", - "value": "ElementInternals", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", "description": "", "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true } ], - "value": "declare class ColorPicker extends BaseClass$2 implements ColorPickerProps {\n accessor alpha: boolean;\n accessor name: string;\n accessor defaultValue: string;\n get value(): string;\n set value(value: string);\n /**\n * A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`.\n */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class ColorPicker extends BaseClass implements ColorPickerProps {\n /**\n * Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.\n *\n * @default false\n */\n alpha: boolean;\n /**\n * The name of the picker, used when submitting form data.\n */\n name: string;\n /**\n * The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n defaultValue: string;\n /**\n * The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n}" }, "DateField": { "filePath": "src/surfaces/admin/components.ts", "name": "DateField", - "description": "Configure the following properties on the date field component.", - "isPublicDocs": true, + "description": "The date field custom element class that renders a date input field with integrated calendar picker in the Shopify admin interface. This component allows merchants to select dates by typing or using a visual calendar, with support for date range restrictions and day-of-week constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar picker, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar picker first opens, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "DateAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -27649,36 +30953,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "defaultValue": "\"\"" + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -27686,14 +30989,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -27701,7 +31004,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -27725,7 +31028,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -27749,7 +31052,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -27757,31 +31060,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected date in `YYYY-MM-DD` format. An empty string means no date is selected.", - "defaultValue": "\"\"" + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -27819,7 +31128,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -27827,78 +31136,139 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DateField\n extends PreactFieldElement\n implements DateFieldProps\n{\n accessor allow: DateFieldProps['allow'];\n accessor disallow: DateFieldProps['disallow'];\n accessor allowDays: DateFieldProps['allowDays'];\n accessor disallowDays: DateFieldProps['disallowDays'];\n set view(view: string);\n get view(): string;\n accessor defaultView: DateFieldProps['defaultView'];\n constructor();\n}" + "value": "declare class DateField extends DateFieldBase implements DateFieldProps {\n constructor();\n}" }, "DateAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "DateAutocompleteField", "value": "'bday-day' | 'bday-month' | 'bday-year' | 'bday' | 'cc-expiry-month' | 'cc-expiry-year' | 'cc-expiry'", - "description": "Represents autocomplete values that are valid for date input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for date-based inputs.\n\nAvailable values:\n- `bday` - Complete birthday date\n- `bday-day` - Day component of a birthday (1-31)\n- `bday-month` - Month component of a birthday (1-12)\n- `bday-year` - Year component of a birthday (1990)\n- `cc-expiry` - Complete credit card expiration date\n- `cc-expiry-month` - Month component of a credit card expiration date (1-12)\n- `cc-expiry-year` - Year component of a credit card expiration date (2025)", - "isPublicDocs": true + "description": "" }, "DatePicker": { "filePath": "src/surfaces/admin/components.ts", "name": "DatePicker", - "description": "Configure the following properties on the date picker component.", - "isPublicDocs": true, + "description": "The date picker custom element class that renders a standalone calendar interface in the Shopify admin. This component allows merchants to select single dates or date ranges using an interactive calendar with month/year navigation, date constraints, and day-of-week restrictions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar first renders, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"single\" | \"range\"", - "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "description": "The type of date selection allowed. Available values: `single`, `range`.", "defaultValue": "\"single\"" }, { @@ -27906,7 +31276,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initially selected date(s) when the component first renders. An empty string means no date is initially selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The initial selected date or date range when the picker first renders, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -27914,14 +31284,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "value", "value": "string", - "description": "The currently selected date(s). An empty string means no date is selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The currently selected date or date range, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -27935,19 +31305,26 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@dirtyStateSymbol@11579", - "value": "boolean", + "name": "__@internals$1@16931", + "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$1@11578", - "value": "ElementInternals", + "name": "__@dirtyStateSymbol@16932", + "value": "boolean", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -27993,7 +31370,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -28001,17 +31378,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DatePicker extends BaseClass$1 implements DatePickerProps {\n accessor defaultView: string;\n set view(view: string);\n get view(): string;\n accessor allow: DatePickerProps['allow'];\n accessor disallow: DatePickerProps['disallow'];\n accessor allowDays: DatePickerProps['allowDays'];\n accessor disallowDays: DatePickerProps['disallowDays'];\n accessor type: DatePickerProps['type'];\n accessor defaultValue: DatePickerProps['defaultValue'];\n accessor name: DatePickerProps['name'];\n set value(value: string);\n get value(): string;\n /** @private */\n [dirtyStateSymbol]: boolean;\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DatePicker\n extends DatePickerBase\n implements DatePickerProps\n{\n constructor();\n}" }, "DropZone": { "filePath": "src/surfaces/admin/components.ts", "name": "DropZone", - "description": "Configure the following properties on the drop zone component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -28033,29 +31424,29 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -28071,14 +31462,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -28108,7 +31499,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@setFiles@11614", + "name": "__@setFiles@16968", "value": "(files: File[]) => void", "description": "", "isPrivate": true @@ -28116,7 +31507,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@getFileInput@11616", + "name": "__@getFileInput@16970", "value": "() => HTMLInputElement", "description": "", "isPrivate": true @@ -28124,11 +31515,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals@11615", + "name": "__@internals@16969", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -28174,7 +31572,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -28182,17 +31580,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DropZone extends BaseClass implements DropZoneProps {\n accessor accept: DropZoneProps['accept'];\n accessor accessibilityLabel: DropZoneProps['accessibilityLabel'];\n accessor disabled: DropZoneProps['disabled'];\n accessor error: DropZoneProps['error'];\n accessor label: DropZoneProps['label'];\n accessor labelAccessibilityVisibility: DropZoneProps['labelAccessibilityVisibility'];\n accessor multiple: DropZoneProps['multiple'];\n accessor name: DropZoneProps['name'];\n accessor required: DropZoneProps['required'];\n get value(): string;\n /** This sets the input value for a file type, which cannot be set programatically, so it can only be reset. */\n set value(value: '' | null);\n get files(): File[];\n set files(files: File[]);\n /** @private */\n [setFiles](files: File[]): void;\n /** @private */\n [getFileInput](): ReplaceType<\n Element | null | undefined,\n Element,\n HTMLInputElement\n >;\n\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DropZone extends DropZoneBase implements DropZoneProps {\n constructor();\n}" }, "Divider": { "filePath": "src/surfaces/admin/components.ts", "name": "Divider", - "description": "Configure the following properties on the divider component.", - "isPublicDocs": true, + "description": "A divider is a visual separator that creates a line between different sections of content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -28210,6 +31622,13 @@ "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -28255,7 +31674,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -28263,32 +31682,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Divider extends PreactCustomElement implements DividerProps {\n accessor direction: DividerProps['direction'];\n accessor color: DividerProps['color'];\n constructor();\n}" + "value": "declare class Divider extends PolarisCustomElement implements DividerProps {\n /**\n * The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n *\n * - `inline`: Horizontal divider for separating vertically stacked content\n * - `block`: Vertical divider for separating horizontally arranged content\n *\n * @default 'inline'\n */\n direction: DividerProps['direction'];\n /**\n * The visual prominence of the divider line.\n *\n * - `base`: Standard divider for most separations (default)\n * - `strong`: More prominent divider for major section breaks\n *\n * @default 'base'\n */\n color: DividerProps['color'];\n constructor();\n}" }, "EmailField": { "filePath": "src/surfaces/admin/components.ts", "name": "EmailField", - "description": "Configure the following properties on the email field component.", - "isPublicDocs": true, + "description": "The email field custom element class that renders an email input field in the Shopify admin interface. This component allows merchants to enter email addresses with automatic validation and optimized mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | EmailAutocompleteField | `section-${string} email` | `section-${string} home email` | `section-${string} mobile email` | `section-${string} fax email` | `section-${string} pager email` | \"shipping email\" | \"shipping home email\" | \"shipping mobile email\" | \"shipping fax email\" | \"shipping pager email\" | \"billing email\" | \"billing home email\" | \"billing mobile email\" | \"billing fax email\" | \"billing pager email\" | `section-${string} shipping email` | `section-${string} shipping home email` | `section-${string} shipping mobile email` | `section-${string} shipping fax email` | `section-${string} shipping pager email` | `section-${string} billing email` | `section-${string} billing home email` | `section-${string} billing mobile email` | `section-${string} billing fax email` | `section-${string} billing pager email`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint as to the intended content of the field for autocomplete purposes.", + "defaultValue": "'email'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -28296,50 +31729,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -28347,14 +31773,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -28362,7 +31788,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -28386,7 +31812,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -28410,7 +31836,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -28418,23 +31844,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -28472,7 +31912,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -28480,32 +31920,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class EmailField\n extends PreactFieldElement\n implements EmailFieldProps\n{\n accessor autocomplete: EmailFieldProps['autocomplete'];\n accessor maxLength: EmailFieldProps['maxLength'];\n accessor minLength: EmailFieldProps['minLength'];\n /**\n * The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class EmailField extends EmailFieldBase implements EmailFieldProps {\n constructor();\n}" }, "EmailAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "EmailAutocompleteField", "value": "'email' | 'home email' | 'mobile email' | 'fax email' | 'pager email'", - "description": "Represents autocomplete values that are valid for email input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for email inputs.\n\nAvailable values:\n- `email` - Primary email address\n- `home email` - Home email address\n- `mobile email` - Mobile device email address\n- `fax email` - Fax machine email address\n- `pager email` - Pager device email address", - "isPublicDocs": true + "description": "" }, "Grid": { "filePath": "src/surfaces/admin/components.ts", "name": "Grid", - "description": "Configure the following properties on the grid component.", - "isPublicDocs": true, + "description": "A grid is a layout component that arranges its children in rows and columns with precise control over sizing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridTemplateColumns", "value": "string", - "description": "The columns in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid columns.", "defaultValue": "'none'" }, { @@ -28513,7 +31966,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridTemplateRows", "value": "string", - "description": "The rows in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid rows.", "defaultValue": "'none'" }, { @@ -28521,7 +31974,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyItems", "value": "\"\" | JustifyItemsKeyword", - "description": "Aligns the grid items along the inline axis.", + "description": "The alignment of grid items along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -28529,7 +31982,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "\"\" | AlignItemsKeyword", - "description": "Aligns the grid items along the block axis.", + "description": "The alignment of grid items along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -28537,7 +31990,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeItems", "value": "AlignItemsKeyword | \"normal normal\" | \"normal stretch\" | \"normal baseline\" | \"normal first baseline\" | \"normal last baseline\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch baseline\" | \"stretch first baseline\" | \"stretch last baseline\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline baseline\" | \"baseline first baseline\" | \"baseline last baseline\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline baseline\" | \"first baseline first baseline\" | \"first baseline last baseline\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline baseline\" | \"last baseline first baseline\" | \"last baseline last baseline\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start baseline\" | \"start first baseline\" | \"start last baseline\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end baseline\" | \"end first baseline\" | \"end last baseline\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center baseline\" | \"center first baseline\" | \"center last baseline\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start baseline\" | \"unsafe start first baseline\" | \"unsafe start last baseline\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end baseline\" | \"unsafe end first baseline\" | \"unsafe end last baseline\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center baseline\" | \"unsafe center first baseline\" | \"unsafe center last baseline\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start baseline\" | \"safe start first baseline\" | \"safe start last baseline\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end baseline\" | \"safe end first baseline\" | \"safe end last baseline\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center baseline\" | \"safe center first baseline\" | \"safe center last baseline\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\"", - "description": "A shorthand property for `justify-items` and `align-items`.", + "description": "A shorthand for setting both `alignItems` and `justifyItems`.", "defaultValue": "'normal normal'" }, { @@ -28545,7 +31998,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "\"\" | JustifyContentKeyword", - "description": "Aligns the grid along the inline axis. This overrides the inline value of `placeContent`.", + "description": "The alignment of the grid along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -28553,7 +32006,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "\"\" | AlignContentKeyword", - "description": "Aligns the grid along the block axis. This overrides the block value of `placeContent`.", + "description": "The alignment of the grid along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -28561,7 +32014,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeContent", "value": "\"normal normal\" | \"normal stretch\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\" | AlignContentKeyword | \"normal space-between\" | \"normal space-around\" | \"normal space-evenly\" | \"baseline space-between\" | \"baseline space-around\" | \"baseline space-evenly\" | \"first baseline space-between\" | \"first baseline space-around\" | \"first baseline space-evenly\" | \"last baseline space-between\" | \"last baseline space-around\" | \"last baseline space-evenly\" | \"start space-between\" | \"start space-around\" | \"start space-evenly\" | \"end space-between\" | \"end space-around\" | \"end space-evenly\" | \"center space-between\" | \"center space-around\" | \"center space-evenly\" | \"unsafe start space-between\" | \"unsafe start space-around\" | \"unsafe start space-evenly\" | \"unsafe end space-between\" | \"unsafe end space-around\" | \"unsafe end space-evenly\" | \"unsafe center space-between\" | \"unsafe center space-around\" | \"unsafe center space-evenly\" | \"safe start space-between\" | \"safe start space-around\" | \"safe start space-evenly\" | \"safe end space-between\" | \"safe end space-around\" | \"safe end space-evenly\" | \"safe center space-between\" | \"safe center space-around\" | \"safe center space-evenly\" | \"stretch space-between\" | \"stretch space-around\" | \"stretch space-evenly\" | \"space-between normal\" | \"space-between start\" | \"space-between end\" | \"space-between center\" | \"space-between unsafe start\" | \"space-between unsafe end\" | \"space-between unsafe center\" | \"space-between safe start\" | \"space-between safe end\" | \"space-between safe center\" | \"space-between stretch\" | \"space-between space-between\" | \"space-between space-around\" | \"space-between space-evenly\" | \"space-around normal\" | \"space-around start\" | \"space-around end\" | \"space-around center\" | \"space-around unsafe start\" | \"space-around unsafe end\" | \"space-around unsafe center\" | \"space-around safe start\" | \"space-around safe end\" | \"space-around safe center\" | \"space-around stretch\" | \"space-around space-between\" | \"space-around space-around\" | \"space-around space-evenly\" | \"space-evenly normal\" | \"space-evenly start\" | \"space-evenly end\" | \"space-evenly center\" | \"space-evenly unsafe start\" | \"space-evenly unsafe end\" | \"space-evenly unsafe center\" | \"space-evenly safe start\" | \"space-evenly safe end\" | \"space-evenly safe center\" | \"space-evenly stretch\" | \"space-evenly space-between\" | \"space-evenly space-around\" | \"space-evenly space-evenly\"", - "description": "A shorthand property for `justify-content` and `align-content`.", + "description": "A shorthand for setting both `alignContent` and `justifyContent`.", "defaultValue": "'normal normal'" }, { @@ -28569,7 +32022,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows and columns.", "defaultValue": "'none'" }, { @@ -28577,7 +32030,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "s spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows.", "defaultValue": "'' - meaning no override" }, { @@ -28585,7 +32038,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid columns.", "defaultValue": "'' - meaning no override" }, { @@ -28593,7 +32046,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -28601,7 +32054,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -28609,7 +32062,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -28617,7 +32070,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -28625,7 +32078,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -28633,7 +32086,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -28641,7 +32094,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -28649,7 +32102,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -28657,7 +32110,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -28665,7 +32118,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -28673,7 +32126,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -28681,7 +32134,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -28689,7 +32142,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -28697,7 +32150,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -28705,7 +32158,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -28713,7 +32166,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -28721,7 +32174,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -28741,7 +32194,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -28749,7 +32202,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -28757,7 +32210,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -28765,7 +32218,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -28773,14 +32226,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -28788,9 +32241,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -28836,7 +32296,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -28844,96 +32304,101 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n accessor gridTemplateColumns: GridProps['gridTemplateColumns'];\n accessor gridTemplateRows: GridProps['gridTemplateRows'];\n accessor justifyItems: GridProps['justifyItems'];\n accessor alignItems: GridProps['alignItems'];\n accessor placeItems: GridProps['placeItems'];\n accessor justifyContent: GridProps['justifyContent'];\n accessor alignContent: GridProps['alignContent'];\n accessor placeContent: GridProps['placeContent'];\n accessor gap: GridProps['gap'];\n accessor rowGap: GridProps['rowGap'];\n accessor columnGap: GridProps['columnGap'];\n}" + "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n /**\n * The template that defines the grid columns.\n */\n gridTemplateColumns: GridProps['gridTemplateColumns'];\n /**\n * The template that defines the grid rows.\n */\n gridTemplateRows: GridProps['gridTemplateRows'];\n /**\n * The alignment of grid items along the inline axis.\n */\n justifyItems: GridProps['justifyItems'];\n /**\n * The alignment of grid items along the block axis.\n */\n alignItems: GridProps['alignItems'];\n /**\n * A shorthand for setting both `alignItems` and `justifyItems`.\n */\n placeItems: GridProps['placeItems'];\n /**\n * The alignment of the grid along the inline axis.\n */\n justifyContent: GridProps['justifyContent'];\n /**\n * The alignment of the grid along the block axis.\n */\n alignContent: GridProps['alignContent'];\n /**\n * A shorthand for setting both `alignContent` and `justifyContent`.\n */\n placeContent: GridProps['placeContent'];\n /**\n * The spacing between grid rows and columns.\n */\n gap: GridProps['gap'];\n /**\n * The spacing between grid rows.\n */\n rowGap: GridProps['rowGap'];\n /**\n * The spacing between grid columns.\n */\n columnGap: GridProps['columnGap'];\n}" }, "JustifyItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.\n\nLearn more about the [justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).", - "isPublicDocs": true + "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis." }, "BaselinePosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BaselinePosition", "value": "'baseline' | 'first baseline' | 'last baseline'", - "description": "Represents baseline alignment positions used to align items relative to their baselines.\n- `baseline`: Aligns to the baseline of the parent.\n- `first baseline`: Aligns to the first baseline of the parent.\n- `last baseline`: Aligns to the last baseline of the parent.", - "isPublicDocs": true + "description": "" }, "OverflowPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "OverflowPosition", "value": "`unsafe ${ContentPosition}` | `safe ${ContentPosition}`", - "description": "Represents content positioning with overflow behavior control. Use `safe` to prevent content from becoming inaccessible when it overflows, or `unsafe` to allow overflow regardless of accessibility.", - "isPublicDocs": true + "description": "" }, "ContentPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentPosition", "value": "'center' | 'start' | 'end'", - "description": "Defines the position of content along an axis.\n- `center`: Centers the content.\n- `start`: Aligns content to the start.\n- `end`: Aligns content to the end.", - "isPublicDocs": true + "description": "" }, "AlignItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Align items sets the align-self value on all direct children as a group.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isPublicDocs": true + "description": "Align items sets the align-self value on all direct children as a group." }, "JustifyContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyContentKeyword", "value": "'normal' | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", - "isPublicDocs": true + "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container." }, "ContentDistribution": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentDistribution", "value": "'space-between' | 'space-around' | 'space-evenly' | 'stretch'", - "description": "Defines how space is distributed between and around content items in flex and grid layouts.\n- `space-between`: Distributes items evenly with the first item at the start and last at the end.\n- `space-around`: Distributes items evenly with equal space around each item.\n- `space-evenly`: Distributes items evenly with equal space between them.\n- `stretch`: Stretches items to fill the container.", - "isPublicDocs": true + "description": "" }, "AlignContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignContentKeyword", "value": "'normal' | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isPublicDocs": true + "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis." }, "SpacingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SpacingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the spacing size between elements, using the standard size scale or `none` for no spacing.", - "isPublicDocs": true + "description": "" }, "GridItem": { "filePath": "src/surfaces/admin/components.ts", "name": "GridItem", - "description": "The grid item component represents a single cell within a grid layout, allowing you to control how content is positioned and sized within the grid. Use grid item as a child of grid to specify column span, row span, and positioning for individual content areas.\n\nGrid item supports precise placement control through column and row properties, enabling you to create complex layouts where different items occupy varying amounts of space or appear in specific grid positions.", - "isPublicDocs": true, + "description": "A grid item is a child of a grid that can be positioned within specific rows and columns.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridColumn", "value": "\"auto\" | `span ${number}`", - "description": "The number of columns the item will span across.\n\nLearn more about the [grid-column property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).", + "description": "The column position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -28941,7 +32406,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridRow", "value": "\"auto\" | `span ${number}`", - "description": "The number of rows the item will span across.\n\nLearn more about the [grid-row property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).", + "description": "The row position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -28949,7 +32414,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -28957,7 +32422,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -28965,7 +32430,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -28973,7 +32438,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -28981,7 +32446,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -28989,7 +32454,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -28997,7 +32462,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -29005,7 +32470,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -29013,7 +32478,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -29021,7 +32486,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -29029,7 +32494,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -29037,7 +32502,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -29045,7 +32510,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -29053,7 +32518,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -29061,7 +32526,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -29069,7 +32534,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -29077,7 +32542,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -29097,7 +32562,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -29105,7 +32570,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -29113,7 +32578,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -29121,7 +32586,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -29129,14 +32594,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -29144,9 +32609,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -29192,7 +32664,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -29200,24 +32672,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class GridItem extends BoxElement implements GridItemProps {\n accessor gridColumn: GridItemProps['gridColumn'];\n accessor gridRow: GridItemProps['gridRow'];\n constructor();\n}" + "value": "declare class GridItem extends BoxElement implements GridItemProps {\n /**\n * The column position and span of the grid item.\n */\n gridColumn: GridItemProps['gridColumn'];\n /**\n * The row position and span of the grid item.\n */\n gridRow: GridItemProps['gridRow'];\n constructor();\n}" }, "Heading": { "filePath": "src/surfaces/admin/components.ts", "name": "Heading", - "description": "Configure the following properties on the heading component.", - "isPublicDocs": true, + "description": "A custom element for displaying hierarchical section titles and headings with appropriate semantic meaning and visual styling. Use Heading to structure your content with proper heading levels for both visual hierarchy and accessibility.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"heading\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The ARIA role for the heading. Set to `'heading'` (the default) for standard heading semantics, or `'presentation'` / `'none'` to remove heading semantics for decorative use.", "defaultValue": "'heading'" }, { @@ -29225,7 +32711,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lineClamp", "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", "defaultValue": "Infinity - no truncation is applied" }, { @@ -29233,9 +32719,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -29281,7 +32774,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -29289,47 +32782,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Heading extends PreactCustomElement implements HeadingProps {\n accessor accessibilityRole: HeadingProps['accessibilityRole'];\n accessor lineClamp: HeadingProps['lineClamp'];\n accessor accessibilityVisibility: HeadingProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Heading extends HeadingBase implements HeadingProps {\n constructor();\n}" }, "Icon": { "filePath": "src/surfaces/admin/components.ts", "name": "Icon", - "description": "Configure the following properties on the icon component.", - "isPublicDocs": true, + "description": "An icon displays a graphical symbol from the icon library.", "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", + "description": "The color tone of the icon based on its semantic meaning.", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "The icon to display from the icon library.\n\nSet to a valid icon name to display that icon. To hide the icon completely, use an empty string `''`. To reserve the icon's space without displaying an icon, use `'empty'`." + "value": "\"\" | IconType", + "description": "The type of icon to display." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color emphasis of the icon.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"base\"", - "description": "The size of the icon.\n\n- `small`: Smaller icon suitable for inline use within text or compact UI elements.\n- `base`: Default size that works well for standalone icons and standard use cases.", + "description": "The size of the icon.", "defaultValue": "'base'" }, { @@ -29337,7 +32844,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The element that this icon should show interest for when activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -29384,7 +32898,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -29392,53 +32906,67 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Icon extends PreactCustomElement implements IconProps {\n accessor color: IconProps['color'];\n accessor tone: IconProps['tone'];\n accessor type: IconProps['type'];\n accessor size: IconProps['size'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Icon extends IconBase implements IconProps {\n /**\n * The color tone of the icon based on its semantic meaning.\n */\n tone: IconProps['tone'];\n /**\n * The type of icon to display.\n */\n type: IconProps['type'];\n constructor();\n}" }, "Image": { "filePath": "src/surfaces/admin/components.ts", "name": "Image", - "description": "Configure the following properties on the image component.", - "isPublicDocs": true, + "description": "An image displays pictures with configurable sizing, loading behavior, and borders.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "srcSet", "value": "string", - "description": "A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n\nLearn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset)." + "description": "A set of source images with different sizes for responsive loading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "sizes", "value": "string", - "description": "A set of media conditions and their corresponding sizes.\n\nLearn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes)." + "description": "The sizes of the image at different viewport widths." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "aspectRatio", "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", - "description": "The aspect ratio of the image.\n\nThe rendering of the image will depend on the `inlineSize` value:\n\n- `inlineSize=\"fill\"`: the aspect ratio will be respected and the image will take the necessary space.\n- `inlineSize=\"auto\"`: the image will not render until it has loaded and the aspect ratio will be ignored.\n\nFor example, if the value is set as `50 / 100`, the getter returns `50 / 100`. If the value is set as `0.5`, the getter returns `0.5 / 1`.\n\nLearn more about the [aspect-ratio property](https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio).", + "description": "The aspect ratio of the image as a width-to-height ratio.", "defaultValue": "'1/1'" }, { @@ -29446,7 +32974,7 @@ "syntaxKind": "PropertyDeclaration", "name": "objectFit", "value": "\"contain\" | \"cover\"", - "description": "The image resizing behavior to fit within its container.\n\n- `contain`: Scales the image to fit within the container while maintaining its aspect ratio. The entire image is visible, but might leave empty space.\n- `cover`: Scales the image to fill the entire container while maintaining its aspect ratio. The image might be cropped to fit.\n\nThe image is always positioned in the center of the container.\n\nLearn more about the [object-fit property](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).", + "description": "How the image should be resized to fit its container.", "defaultValue": "'contain'" }, { @@ -29454,7 +32982,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "\"eager\" | \"lazy\"", - "description": "The loading strategy for the image.\n\n- `eager`: Immediately loads the image, irrespective of its position within the visible viewport.\n- `lazy`: Delays loading the image until it approaches a specified distance from the viewport.\n\nLearn more about the [loading attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading).", + "description": "When the image should be loaded.", "defaultValue": "'eager'" }, { @@ -29462,7 +32990,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"img\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The accessibility role for the image.", "defaultValue": "'img'" }, { @@ -29470,7 +32998,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "\"auto\" | \"fill\"", - "description": "The displayed inline width of the image.\n\n- `fill`: the image will takes up 100% of the available inline size.\n- `auto`: the image will be displayed at its natural size.\n\nLearn more about the [width attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#width).", + "description": "The inline size (width in horizontal writing modes) of the image.", "defaultValue": "'fill'" }, { @@ -29478,35 +33006,23 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied around the image using shorthand syntax to specify width, color, and style in a single property.", - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "description": "Whether to show a border around the image.", + "defaultValue": "'none' - equivalent to `none base auto`." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderWidth", - "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderStyle", - "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image.", "defaultValue": "'' - meaning no override" }, { @@ -29514,17 +33030,24 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "The color of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the image's corners using the design system's radius scale.", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image.", "defaultValue": "'none'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -29570,7 +33093,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -29578,24 +33101,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Image extends PreactCustomElement implements ImageProps {\n accessor src: ImageProps['src'];\n accessor srcSet: ImageProps['srcSet'];\n accessor sizes: ImageProps['sizes'];\n accessor alt: ImageProps['alt'];\n accessor aspectRatio: ImageProps['aspectRatio'];\n accessor objectFit: ImageProps['objectFit'];\n accessor loading: ImageProps['loading'];\n accessor accessibilityRole: ImageProps['accessibilityRole'];\n accessor inlineSize: ImageProps['inlineSize'];\n /**\n * A border applied around the image using shorthand syntax to specify width, color, and style in a single property.\n */\n accessor border: ImageProps['border'];\n /**\n * The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.\n */\n accessor borderWidth: ImageProps['borderWidth'];\n /**\n * The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.\n */\n accessor borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.\n */\n accessor borderColor: ImageProps['borderColor'];\n /**\n * The roundedness of the image's corners using the design system's radius scale.\n */\n accessor borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + "value": "declare class Image extends PolarisCustomElement implements ImageProps {\n /**\n * The URL of the image to display.\n */\n src: ImageProps['src'];\n /**\n * A set of source images with different sizes for responsive loading.\n */\n srcSet: ImageProps['srcSet'];\n /**\n * The sizes of the image at different viewport widths.\n */\n sizes: ImageProps['sizes'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ImageProps['alt'];\n /**\n * The aspect ratio of the image as a width-to-height ratio.\n */\n aspectRatio: ImageProps['aspectRatio'];\n /**\n * How the image should be resized to fit its container.\n */\n objectFit: ImageProps['objectFit'];\n /**\n * When the image should be loaded.\n */\n loading: ImageProps['loading'];\n /**\n * The accessibility role for the image.\n */\n accessibilityRole: ImageProps['accessibilityRole'];\n /**\n * The inline size (width in horizontal writing modes) of the image.\n */\n inlineSize: ImageProps['inlineSize'];\n /**\n * Whether to show a border around the image.\n */\n border: ImageProps['border'];\n /**\n * The width of the border around the image.\n */\n borderWidth: ImageProps['borderWidth'];\n /**\n * The style of the border around the image.\n */\n borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image.\n */\n borderColor: ImageProps['borderColor'];\n /**\n * The radius of the border corners around the image.\n */\n borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + }, + "BorderRadiusKeyword": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "BorderRadiusKeyword", + "value": "SizeKeyword | 'max' | 'none'", + "description": "" }, "Link": { "filePath": "src/surfaces/admin/components.ts", "name": "Link", - "description": "Configure the following properties on the link component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", "defaultValue": "'auto'" }, { @@ -29603,21 +33147,21 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -29625,14 +33169,21 @@ "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "lang", "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)." + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -29679,7 +33230,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -29687,15 +33238,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -29703,24 +33269,30 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Link extends Link_base implements LinkProps {\n accessor tone: LinkProps['tone'];\n accessor accessibilityLabel: LinkProps['accessibilityLabel'];\n accessor href: LinkProps['href'];\n accessor target: LinkProps['target'];\n accessor download: LinkProps['download'];\n accessor lang: LinkProps['lang'];\n constructor();\n}" + "value": "declare class Link extends LinkBase implements LinkProps {\n tone: LinkProps['tone'];\n constructor();\n}" }, "ListItem": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItem", - "description": "The list item component represents a single entry within an ordered list or unordered list. Use list item to structure individual points, steps, or items within a list, with each item automatically receiving appropriate list markers (bullets or numbers) from its parent list.\n\nList item must be used as a direct child of ordered list or unordered list components. Each list item can contain text, inline formatting, or other components to create rich list content.", - "isPublicDocs": true, + "description": "A component that represents a single item within an ordered list or unordered list.\n\nUse list item as a child of ordered list or unordered list to create properly structured and accessible list content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -29766,7 +33338,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -29774,24 +33346,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ListItem extends PreactCustomElement implements ListItemProps {\n constructor();\n}" + "value": "declare class ListItem extends PolarisCustomElement implements ListItemProps {\n constructor();\n}" }, "Menu": { "filePath": "src/surfaces/admin/components.ts", "name": "Menu", - "description": "Configure the following properties on the menu component.", - "isPublicDocs": true, + "description": "A component that displays a contextual list of actions or options, which is typically triggered by a button or other activator element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the menu for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", @@ -29812,7 +33398,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -29820,7 +33406,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -29828,11 +33414,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -29862,7 +33455,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -29870,24 +33463,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n accessor accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n /**\n * A label that describes the menu for assistive technologies.\n */\n accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "MoneyField": { "filePath": "src/surfaces/admin/components.ts", "name": "MoneyField", - "description": "Configure the following properties on the money field component.", - "isPublicDocs": true, + "description": "The money field custom element class that renders a monetary input field in the Shopify admin interface. This component allows merchants to enter currency amounts with automatic formatting, decimal precision, and validation against minimum and maximum values.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum monetary value allowed in the field.", "defaultValue": "Infinity" }, { @@ -29895,9 +33502,17 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum monetary value allowed in the field.", "defaultValue": "-Infinity" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "currencyCode", + "value": "\"auto\" | CurrencyCode", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -29910,7 +33525,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "string", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -29918,35 +33533,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -29954,14 +33569,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -29969,7 +33584,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -29993,7 +33608,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -30017,7 +33632,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -30025,23 +33640,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -30079,7 +33701,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -30087,17 +33709,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class MoneyField\n extends PreactFieldElement\n implements MoneyFieldProps\n{\n accessor max: MoneyFieldProps['max'];\n accessor min: MoneyFieldProps['min'];\n /**\n * The current monetary value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string representing the amount in the store's currency.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class MoneyField extends MoneyFieldBase implements MoneyFieldProps {\n constructor();\n}" + }, + "CurrencyCode": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CurrencyCode", + "value": "'USD' | 'EUR' | 'GBP' | 'CAD' | 'AFN' | 'ALL' | 'DZD' | 'AOA' | 'ARS' | 'AMD' | 'AWG' | 'AUD' | 'BBD' | 'AZN' | 'BDT' | 'BSD' | 'BHD' | 'BIF' | 'BZD' | 'BMD' | 'BTN' | 'BAM' | 'BRL' | 'BOB' | 'BWP' | 'BND' | 'BGN' | 'MMK' | 'KHR' | 'CVE' | 'KYD' | 'XAF' | 'CLP' | 'CNY' | 'COP' | 'KMF' | 'CDF' | 'CRC' | 'HRK' | 'CZK' | 'DKK' | 'DOP' | 'XCD' | 'EGP' | 'ETB' | 'XPF' | 'FJD' | 'GMD' | 'GHS' | 'GTQ' | 'GYD' | 'GEL' | 'HTG' | 'HNL' | 'HKD' | 'HUF' | 'ISK' | 'INR' | 'IDR' | 'ILS' | 'IQD' | 'JMD' | 'JPY' | 'JEP' | 'JOD' | 'KZT' | 'KES' | 'KWD' | 'KGS' | 'LAK' | 'LVL' | 'LBP' | 'LSL' | 'LRD' | 'LTL' | 'MGA' | 'MKD' | 'MOP' | 'MWK' | 'MVR' | 'MXN' | 'MYR' | 'MUR' | 'MDL' | 'MAD' | 'MNT' | 'MZN' | 'NAD' | 'NPR' | 'ANG' | 'NZD' | 'NIO' | 'NGN' | 'NOK' | 'OMR' | 'PAB' | 'PKR' | 'PGK' | 'PYG' | 'PEN' | 'PHP' | 'PLN' | 'QAR' | 'RON' | 'RUB' | 'RWF' | 'WST' | 'SAR' | 'RSD' | 'SCR' | 'SGD' | 'SDG' | 'SYP' | 'ZAR' | 'KRW' | 'SSP' | 'SBD' | 'LKR' | 'SRD' | 'SZL' | 'SEK' | 'CHF' | 'TWD' | 'THB' | 'TZS' | 'TTD' | 'TND' | 'TRY' | 'TMT' | 'UGX' | 'UAH' | 'AED' | 'UYU' | 'UZS' | 'VUV' | 'VND' | 'XOF' | 'YER' | 'ZMW' | 'BYN' | 'BYR' | 'DJF' | 'ERN' | 'FKP' | 'GIP' | 'GNF' | 'IRR' | 'KID' | 'LYD' | 'MRU' | 'SLL' | 'SHP' | 'SOS' | 'STD' | 'STN' | 'TJS' | 'TOP' | 'VED' | 'VEF' | 'VES' | 'XXX'", + "description": "" }, "NumberField": { "filePath": "src/surfaces/admin/components.ts", "name": "NumberField", - "description": "Configure the following properties on the number field component.", - "isPublicDocs": true, + "description": "The number field custom element class that renders a numeric input field in the Shopify admin interface. This component allows merchants to enter numbers with automatic validation and prefix/suffix display.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -30111,7 +33754,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inputMode", "value": "\"decimal\" | \"numeric\"", - "description": "The type of virtual keyboard to display on mobile devices.\n\n- `decimal`: Shows a numeric keyboard with a decimal point, suitable for prices or measurements.\n- `numeric`: Shows a numeric keyboard without a decimal point, suitable for whole numbers like quantities.\n\nLearn more about the [inputmode attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode).", + "description": "The input mode hint for mobile keyboards. Available values include:\n- `numeric`: Shows a numeric keypad optimized for entering numbers\n- `decimal`: Shows a numeric keypad with decimal point support\n- `tel`: Shows a telephone keypad", "defaultValue": "'decimal'" }, { @@ -30119,7 +33762,7 @@ "syntaxKind": "PropertyDeclaration", "name": "step", "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "description": "The granularity that the value must adhere to, or the keyword `any`. This controls the increment/decrement step size.", "defaultValue": "1" }, { @@ -30127,7 +33770,7 @@ "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum numeric value allowed in the field.", "defaultValue": "Infinity" }, { @@ -30135,7 +33778,7 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum numeric value allowed in the field.", "defaultValue": "-Infinity" }, { @@ -30143,7 +33786,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the user's input, such as a currency symbol.", "defaultValue": "''" }, { @@ -30151,7 +33794,7 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the user's input, such as a unit of measurement.", "defaultValue": "''" }, { @@ -30159,7 +33802,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | NumberAutocompleteField | `section-${string} one-time-code` | `section-${string} cc-number` | `section-${string} cc-csc` | \"shipping one-time-code\" | \"shipping cc-number\" | \"shipping cc-csc\" | \"billing one-time-code\" | \"billing cc-number\" | \"billing cc-csc\" | `section-${string} shipping one-time-code` | `section-${string} shipping cc-number` | `section-${string} shipping cc-csc` | `section-${string} billing one-time-code` | `section-${string} billing cc-number` | `section-${string} billing cc-csc`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -30167,35 +33810,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -30203,14 +33846,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -30218,7 +33861,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -30242,7 +33885,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -30266,7 +33909,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -30274,23 +33917,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -30328,7 +33978,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -30336,32 +33986,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class NumberField\n extends PreactFieldElement\n implements NumberFieldProps\n{\n /**\n * The current numeric value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string (decimal or integer).\n */\n get value(): string;\n set value(value: string);\n accessor inputMode: NumberFieldProps['inputMode'];\n accessor step: NumberFieldProps['step'];\n accessor max: NumberFieldProps['max'];\n accessor min: NumberFieldProps['min'];\n accessor prefix: NumberFieldProps['prefix'];\n accessor suffix: NumberFieldProps['suffix'];\n constructor();\n}" + "value": "declare class NumberField extends NumberFieldBase implements NumberFieldProps {\n constructor();\n}" }, "NumberAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "NumberAutocompleteField", "value": "'one-time-code' | 'cc-number' | 'cc-csc'", - "description": "Represents autocomplete values that are valid for number input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for numeric inputs.\n\nAvailable values:\n- `one-time-code` - One-time codes for authentication (OTP, 2FA codes)\n- `cc-number` - Credit card number\n- `cc-csc` - Credit card security code (CVV/CVC)", - "isPublicDocs": true + "description": "" }, "Option": { "filePath": "src/surfaces/admin/components.ts", "name": "Option", - "description": "Represents a single option within a select component. Use only as a child of s-select components.", - "isPublicDocs": true, + "description": "A single option within a select dropdown that users can choose.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the option is currently selected.", "defaultValue": "false" }, { @@ -30369,7 +34032,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the option should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -30377,16 +34040,23 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this option is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the option is disabled and can't be selected.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -30432,7 +34102,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -30440,24 +34110,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Option extends PreactCustomElement implements OptionProps {\n accessor selected: OptionProps['selected'];\n accessor defaultSelected: OptionProps['defaultSelected'];\n accessor value: OptionProps['value'];\n accessor disabled: OptionProps['disabled'];\n constructor();\n}" + "value": "declare class Option extends PolarisCustomElement implements OptionProps {\n /**\n * Whether the option is currently selected.\n */\n selected: OptionProps['selected'];\n /**\n * Whether the option should be selected when it's first rendered.\n */\n defaultSelected: OptionProps['defaultSelected'];\n /**\n * The value that's submitted with the form when this option is selected.\n */\n value: OptionProps['value'];\n /**\n * Whether the option is disabled and can't be selected.\n */\n disabled: OptionProps['disabled'];\n constructor();\n}" }, "OptionGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionGroup", - "description": "Represents a group of options within a select component. Use only as a child of `s-select` components.", - "isPublicDocs": true, + "description": "A group of related options within a select dropdown, displayed with a label.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the options within this group can be selected or not.", + "description": "Whether all options in the group are disabled and can't be selected.", "defaultValue": "false" }, { @@ -30465,7 +34149,14 @@ "syntaxKind": "PropertyDeclaration", "name": "label", "value": "string", - "description": "The user-facing label for this group of options." + "description": "The text that describes what this group of options represents." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -30512,7 +34203,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -30520,18 +34211,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OptionGroup\n extends PreactCustomElement\n implements OptionGroupProps\n{\n accessor disabled: OptionGroupProps['disabled'];\n accessor label: OptionGroupProps['label'];\n constructor();\n}" + "value": "declare class OptionGroup\n extends PolarisCustomElement\n implements OptionGroupProps\n{\n /**\n * Whether all options in the group are disabled and can't be selected.\n */\n disabled: OptionGroupProps['disabled'];\n /**\n * The text that describes what this group of options represents.\n */\n label: OptionGroupProps['label'];\n constructor();\n}" }, "OrderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "OrderedList", - "description": "Configure the following properties on the ordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a numbered list of items with automatic numbering and proper list semantics. Use ordered list when the sequence or order of items matters, such as instructions, rankings, or step-by-step processes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -30577,7 +34289,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -30585,48 +34297,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OrderedList\n extends PreactCustomElement\n implements OrderedListProps\n{\n constructor();\n}" + "value": "declare class OrderedList\n extends PolarisCustomElement\n implements OrderedListProps\n{\n constructor();\n}" }, "Paragraph": { "filePath": "src/surfaces/admin/components.ts", "name": "Paragraph", - "description": "Configure the following properties on the paragraph component.", - "isPublicDocs": true, + "description": "A custom element for displaying blocks of text content with consistent spacing and styling for readable body copy. Use Paragraph to render longer text content with proper line height and spacing between paragraphs.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "lineClamp", - "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", - "defaultValue": "Infinity - no truncation is applied" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the paragraph text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"caution\"", - "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "lineClamp", + "value": "number", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", + "defaultValue": "Infinity - no truncation is applied" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color of the paragraph text.", "defaultValue": "'base'" }, { @@ -30634,7 +34360,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -30642,9 +34368,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -30690,7 +34423,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -30698,24 +34431,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Paragraph extends PreactCustomElement implements ParagraphProps {\n accessor fontVariantNumeric: ParagraphProps['fontVariantNumeric'];\n accessor lineClamp: ParagraphProps['lineClamp'];\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: ParagraphProps['tone'];\n\n accessor color: ParagraphProps['color'];\n accessor dir: ParagraphProps['dir'];\n accessor accessibilityVisibility: ParagraphProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Paragraph extends ParagraphBase implements ParagraphProps {\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: ParagraphProps['tone'];\n constructor();\n}" }, "PasswordField": { "filePath": "src/surfaces/admin/components.ts", "name": "PasswordField", - "description": "Configure the following properties on the password field component.", - "isPublicDocs": true, + "description": "The password field custom element class that renders a password input field in the Shopify admin interface. This component allows merchants to enter passwords securely with characters automatically masked for privacy.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the password.", "defaultValue": "Infinity" }, { @@ -30723,22 +34470,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the password.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | PasswordAutocompleteField | `section-${string} current-password` | `section-${string} new-password` | \"shipping current-password\" | \"shipping new-password\" | \"billing current-password\" | \"billing new-password\" | `section-${string} shipping current-password` | `section-${string} shipping new-password` | `section-${string} billing current-password` | `section-${string} billing new-password`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -30746,35 +34486,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -30782,14 +34522,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -30797,7 +34537,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -30821,7 +34561,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -30845,7 +34585,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -30853,23 +34593,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -30907,7 +34661,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -30915,34 +34669,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class PasswordField\n extends PreactFieldElement\n implements PasswordFieldProps\n{\n accessor maxLength: PasswordFieldProps['maxLength'];\n accessor minLength: PasswordFieldProps['minLength'];\n /**\n * The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class PasswordField\n extends PasswordFieldBase\n implements PasswordFieldProps\n{\n constructor();\n}" }, "PasswordAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PasswordAutocompleteField", "value": "'current-password' | 'new-password'", - "description": "Represents autocomplete values that are valid for password input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for password inputs.\n\nAvailable values:\n- `current-password` - Existing password for login or authentication\n- `new-password` - New password when creating an account or changing password", - "isPublicDocs": true + "description": "" }, "QueryContainer": { "filePath": "src/surfaces/admin/components.ts", "name": "QueryContainer", - "description": "Configure the following properties on the query container component.", - "isPublicDocs": true, + "description": "A component that sets up a container query context, which lets child elements style themselves based on the container's size instead of the viewport size.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "containerName", "value": "string", - "description": "An identifier for this container that you can reference in CSS container queries to apply styles based on this specific container's size.\n\nAll query container components automatically receive a container name of `s-default`. You can omit the container name in your queries, so `@container (inline-size <= 300px)` is equivalent to `@container s-default (inline-size <= 300px)`.\n\nWhen you provide a custom `containerName`, it's added alongside `s-default`. For example, `containerName=\"product-card\"` results in `s-default product-card` being set on the `container-name` CSS property, allowing you to target this container with `@container product-card (inline-size <= 300px)`.\n\nLearn more about the [container-name property](https://developer.mozilla.org/en-US/docs/Web/CSS/container-name).", + "description": "The name of the container, which you can reference in CSS container queries.", "defaultValue": "''" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -30988,7 +34762,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -30996,24 +34770,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class QueryContainer\n extends PreactCustomElement\n implements QueryContainerProps\n{\n accessor containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" + "value": "declare class QueryContainer\n extends PolarisCustomElement\n implements QueryContainerProps\n{\n /**\n * The name of the container, which you can reference in CSS container queries.\n */\n containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" }, "SearchField": { "filePath": "src/surfaces/admin/components.ts", "name": "SearchField", - "description": "Configure the following properties on the search field component.", - "isPublicDocs": true, + "description": "A search field that lets users enter search queries with a search-specific input type.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters that can be entered in the field.", "defaultValue": "Infinity" }, { @@ -31021,22 +34809,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters that must be entered for the field to be valid.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -31044,35 +34825,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -31080,14 +34861,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -31095,7 +34876,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -31119,7 +34900,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -31143,7 +34924,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -31151,23 +34932,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -31205,7 +35000,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -31213,25 +35008,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class SearchField\n extends PreactFieldElement\n implements SearchFieldProps\n{\n accessor maxLength: SearchFieldProps['maxLength'];\n accessor minLength: SearchFieldProps['minLength'];\n /**\n * The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class SearchField extends SearchFieldBase implements SearchFieldProps {\n constructor();\n}" }, "TextAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" }, "Section": { "filePath": "src/surfaces/admin/components.ts", "name": "Section", - "description": "Configure the following properties on the section component.", - "isPublicDocs": true, + "description": "A section is a container that groups related content together with an optional heading.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -31241,28 +35049,43 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "The accessibility label for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The heading text displayed at the top of the section. This heading provides a title for the section's content and automatically uses the appropriate semantic heading level (h2, h3, h4) based on nesting depth to maintain proper document structure." + "description": "The heading text for the section." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "\"base\" | \"none\"", - "description": "The padding applied to all edges of the element.\n\n- `base`: applies padding that is appropriate for the element. Note that it might result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the section need to span to the edge of the section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "description": "Whether the section has padding.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -31279,14 +35102,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -31300,7 +35115,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -31308,59 +35123,73 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Section extends PreactCustomElement implements SectionProps {\n constructor();\n /** @private */\n connectedCallback(): void;\n accessor accessibilityLabel: SectionProps['accessibilityLabel'];\n accessor heading: SectionProps['heading'];\n accessor padding: SectionProps['padding'];\n}" + "value": "declare class Section extends SectionBase implements SectionProps {\n constructor();\n}" }, "Select": { "filePath": "src/surfaces/admin/components.ts", "name": "Select", - "description": "Configure the following properties on the select component.", - "isPublicDocs": true, + "description": "A select dropdown that lets users choose one option from a list.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier." + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the select." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the select when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the select is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "Text that appears in the select when no option is selected to provide a hint about what to choose." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether an option must be selected before the form can be submitted.", "defaultValue": "false" }, { @@ -31368,7 +35197,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -31392,7 +35221,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component." + "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected Option component." }, { "filePath": "src/surfaces/admin/components.ts", @@ -31405,15 +35234,15 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@usedFirstOptionSymbol@12029", + "name": "__@usedFirstOptionSymbol@17470", "value": "boolean", - "description": "A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n\nThis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.", + "description": "used to determine if no value or defaultValue was set, in which case the first non-disabled option was used\n\nthis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@hasInitialValueSymbol@12030", + "name": "__@hasInitialValueSymbol@17471", "value": "boolean", "description": "", "isPrivate": true @@ -31423,7 +35252,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -31431,23 +35260,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -31477,7 +35313,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -31485,33 +35321,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Select extends PreactInputElement implements SelectProps {\n accessor icon: SelectProps['icon'];\n accessor details: SelectProps['details'];\n accessor error: SelectProps['error'];\n accessor label: SelectProps['label'];\n accessor placeholder: SelectProps['placeholder'];\n accessor required: SelectProps['required'];\n accessor labelAccessibilityVisibility: SelectProps['labelAccessibilityVisibility'];\n /** @private */\n connectedCallback(): void;\n /**\n * A lifecycle callback that fires when the component is removed from the DOM. Performs cleanup operations.\n * @private\n */\n disconnectedCallback(): void;\n constructor();\n /**\n * A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n *\n * This is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.\n * @private\n */\n [usedFirstOptionSymbol]: boolean;\n /**\n * @private\n */\n [hasInitialValueSymbol]: boolean;\n /**\n * The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component.\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n}" + "value": "declare class Select extends SelectBase implements SelectProps {\n constructor();\n}" }, "Spinner": { "filePath": "src/surfaces/admin/components.ts", "name": "Spinner", - "description": "Configure the following properties on the spinner component.", - "isPublicDocs": true, + "description": "A component that displays an animated loading indicator to show that content is currently being processed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the spinner for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the loading spinner.\n\n- `base`: Default size suitable for inline loading indicators or standard UI contexts.\n- `large`: Larger spinner for more prominent loading states.\n- `large-100`: Extra large spinner for full-page or emphasized loading states.", + "description": "The size of the spinner.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -31557,7 +35414,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -31565,24 +35422,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Spinner extends PreactCustomElement implements SpinnerProps {\n accessor accessibilityLabel: string;\n accessor size: SpinnerProps['size'];\n constructor();\n}" + "value": "declare class Spinner extends PolarisCustomElement implements SpinnerProps {\n /**\n * A label that describes the spinner for assistive technologies.\n */\n accessibilityLabel: string;\n /**\n * The size of the spinner.\n */\n size: SpinnerProps['size'];\n constructor();\n}" }, "Stack": { "filePath": "src/surfaces/admin/components.ts", "name": "Stack", - "description": "Configure the following properties on the stack component.", - "isPublicDocs": true, + "description": "A stack is a layout component that arranges its children in a single direction with controlled spacing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "direction", "value": "MaybeResponsive<\"inline\" | \"block\">", - "description": "The direction in which the stack's children are placed within the stack.\n\nAccepts:\n- A single value, either `inline` or `block`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported direction values as a query value", + "description": "The direction in which the stack's children are arranged.", "defaultValue": "'block'" }, { @@ -31590,7 +35461,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "JustifyContentKeyword", - "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -31598,7 +35469,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "AlignItemsKeyword", - "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -31606,7 +35477,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "AlignContentKeyword", - "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.", "defaultValue": "'normal'" }, { @@ -31614,7 +35485,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between the stack's children.", "defaultValue": "'none'" }, { @@ -31622,7 +35493,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between rows in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -31630,7 +35501,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between columns in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -31638,7 +35509,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -31646,7 +35517,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -31654,7 +35525,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -31662,7 +35533,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -31670,7 +35541,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -31678,7 +35549,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -31686,7 +35557,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -31694,7 +35565,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -31702,7 +35573,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -31710,7 +35581,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -31718,7 +35589,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -31726,7 +35597,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -31734,7 +35605,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -31742,7 +35613,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -31750,7 +35621,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -31758,7 +35629,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -31766,7 +35637,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -31786,7 +35657,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -31794,7 +35665,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -31802,7 +35673,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -31810,7 +35681,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -31818,14 +35689,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -31833,9 +35704,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -31881,7 +35759,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -31889,32 +35767,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n accessor direction: StackProps['direction'];\n accessor justifyContent: StackProps['justifyContent'];\n accessor alignItems: StackProps['alignItems'];\n accessor alignContent: StackProps['alignContent'];\n accessor gap: StackProps['gap'];\n accessor rowGap: StackProps['rowGap'];\n accessor columnGap: StackProps['columnGap'];\n}" + "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n /**\n * The direction in which the stack's children are arranged.\n */\n direction: StackProps['direction'];\n /**\n * Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n */\n justifyContent: StackProps['justifyContent'];\n /**\n * Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n */\n alignItems: StackProps['alignItems'];\n /**\n * Controls the distribution of lines along the block axis when content wraps into multiple lines.\n */\n alignContent: StackProps['alignContent'];\n /**\n * The spacing between the stack's children.\n */\n gap: StackProps['gap'];\n /**\n * The spacing between rows in the stack.\n */\n rowGap: StackProps['rowGap'];\n /**\n * The spacing between columns in the stack.\n */\n columnGap: StackProps['columnGap'];\n}" }, "Switch": { "filePath": "src/surfaces/admin/components.ts", "name": "Switch", - "description": "Configure the following properties on the switch component.", - "isPublicDocs": true, + "description": "A switch that lets users toggle a setting on or off with a sliding control.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -31929,7 +35828,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -31937,28 +35836,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -31981,7 +35880,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -31989,23 +35888,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -32051,7 +35957,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -32059,24 +35965,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Switch extends PreactCheckboxElement implements SwitchProps {\n accessor labelAccessibilityVisibility: SwitchProps['labelAccessibilityVisibility'];\n constructor();\n}" + "value": "declare class Switch extends SwitchBase implements SwitchProps {\n constructor();\n}" }, "Table": { "filePath": "src/surfaces/admin/components.ts", "name": "Table", - "description": "Configure the following properties on the table component.", - "isPublicDocs": true, + "description": "A component that displays data in a structured table format that automatically adapts to the available space.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "variant", "value": "\"auto\" | \"list\"", - "description": "The layout variant of the table component.\n\n- `list`: Always displays as a list layout.\n- `table`: Always displays as a traditional table layout.\n- `auto`: Automatically displays as a table on wide screens and as a list on narrow screens.", + "description": "The display variant of the table.", "defaultValue": "'auto'" }, { @@ -32084,7 +36004,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table. When `true`, the table might be in an inert state that prevents user interaction.", + "description": "Whether the table is currently in a loading state.", "defaultValue": "false" }, { @@ -32092,7 +36012,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paginate", "value": "boolean", - "description": "Whether to use pagination controls.", + "description": "Whether the pagination controls are displayed.", "defaultValue": "false" }, { @@ -32100,7 +36020,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hasPreviousPage", "value": "boolean", - "description": "Whether there's a previous page of data.", + "description": "Whether there's a previous page of data that the user can navigate to.", "defaultValue": "false" }, { @@ -32108,25 +36028,40 @@ "syntaxKind": "PropertyDeclaration", "name": "hasNextPage", "value": "boolean", - "description": "Whether there's an additional page of data.", + "description": "Whether there's a next page of data that the user can navigate to.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@actualTableVariantSymbol@12105", - "value": "AddedContext", + "name": "__@elementInternals@17552", + "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@tableHeadersSharedDataSymbol@12106", - "value": "AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", + "name": "__@actualTableVariantSymbol@17550", + "value": "_shopify_admin_web_component_foundations.AddedContext", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@tableHeadersSharedDataSymbol@17551", + "value": "_shopify_admin_web_component_foundations.AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -32172,7 +36107,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -32180,78 +36115,69 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Table extends PreactCustomElement implements TableProps {\n accessor variant: TableProps['variant'];\n accessor loading: TableProps['loading'];\n accessor paginate: TableProps['paginate'];\n accessor hasPreviousPage: TableProps['hasPreviousPage'];\n accessor hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" - }, - "AddedContext": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AddedContext", - "description": "", - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "T", - "description": "The current context value.\n\nThe new context value to set, which will notify all consumers." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "addEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", - "description": "The **`addEventListener()`** method of the EventTarget interface sets up a function that will be called whenever the specified event is delivered to the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener)" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "dispatchEvent", - "value": "(event: Event) => boolean", - "description": "The **`dispatchEvent()`** method of the EventTarget sends an Event to the object, (synchronously) invoking the affected event listeners in the appropriate order.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/dispatchEvent)" + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "removeEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", - "description": "The **`removeEventListener()`** method of the EventTarget interface removes an event listener previously registered with EventTarget.addEventListener() from the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/removeEventListener)" + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AddedContext extends EventTarget {\n constructor(defaultValue: T);\n /**\n * The current context value.\n */\n get value(): T;\n /**\n * The new context value to set, which will notify all consumers.\n */\n set value(value: T);\n}" + "value": "declare class Table extends PolarisCustomElement implements TableProps {\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The display variant of the table.\n */\n variant: TableProps['variant'];\n /**\n * Whether the table is currently in a loading state.\n */\n loading: TableProps['loading'];\n /**\n * Whether the pagination controls are displayed.\n */\n paginate: TableProps['paginate'];\n /**\n * Whether there's a previous page of data that the user can navigate to.\n */\n hasPreviousPage: TableProps['hasPreviousPage'];\n /**\n * Whether there's a next page of data that the user can navigate to.\n */\n hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: _shopify_admin_web_component_foundations.AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: _shopify_admin_web_component_foundations.AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" }, "ActualTableVariant": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ActualTableVariant", "value": "'table' | 'list'", - "description": "Represents the actual rendered variant of a table component.\n- `table`: Displays as a traditional table layout.\n- `list`: Displays as a list layout.", - "isPublicDocs": true + "description": "" }, "ListSlotType": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ListSlotType", "value": "'primary' | 'secondary' | 'kicker' | 'inline' | 'labeled'", - "description": "Represents the semantic type of content slots within list items.\n\n- `primary`: The main content or title of the list item.\n- `secondary`: Supporting or descriptive content below the primary content.\n- `kicker`: A small label or tag displayed above the primary content.\n- `inline`: Content displayed inline with the primary content.\n- `labeled`: Content with an associated label.", - "isPublicDocs": true + "description": "" }, "HeaderFormat": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true }, "TableBody": { "filePath": "src/surfaces/admin/components.ts", "name": "TableBody", - "description": "The table body component represents the main content area of a table, containing the data rows. Use table body as a child of table to structure your table data, with each table row within the body representing a single record or entry.\n\nTable body must contain table row components, which in turn contain table cell components for the actual data values.", - "isPublicDocs": true, + "description": "A component that wraps the body content of a table, which contains the data rows.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -32297,7 +36223,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -32305,26 +36231,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableBody extends PreactCustomElement implements TableBodyProps {\n constructor();\n}" + "value": "declare class TableBody extends PolarisCustomElement implements TableBodyProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n}" }, "TableCell": { "filePath": "src/surfaces/admin/components.ts", "name": "TableCell", - "description": "The table cell component represents a single data cell within a table row. Use table cell as a child of table row to display individual data values, with each cell corresponding to a column in the table.\n\nTable cell automatically inherits styling and alignment from its parent table structure and supports text content or other inline components.", - "isPublicDocs": true, + "description": "A component that represents a single cell in a table row, which displays data in a format that's determined by its column header.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", - "name": "__@headerFormatSymbol@12128", + "name": "__@headerFormatSymbol@17578", "value": "HeaderFormat", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -32370,7 +36325,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -32378,24 +36333,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableCell extends PreactCustomElement implements TableCellProps {\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" + "value": "declare class TableCell extends PolarisCustomElement implements TableCellProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" }, "TableHeader": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeader", - "description": "The table header component represents a single column header within a table header row. Use table header as a child of table header row to define column headings and optionally enable column sorting.\n\nTable header provides semantic meaning for screen readers and can include sorting controls when configured. Each header corresponds to a column in the table body.", - "isPublicDocs": true, + "description": "A component that defines a column header in a table, which specifies both the header label and how the column's data should be formatted.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "listSlot", "value": "ListSlotType", - "description": "The content designation for this column when the table displays in list variant on mobile devices.", + "description": "The slot where this header's data appears when the table is shown in list view.", "defaultValue": "'labeled'" }, { @@ -32403,7 +36372,22 @@ "syntaxKind": "PropertyDeclaration", "name": "format", "value": "HeaderFormat", - "description": "The format of the column that controls styling and alignment of cell content." + "description": "The format of the header and its corresponding cells." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -32450,7 +36434,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -32458,17 +36442,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeader\n extends PreactCustomElement\n implements TableHeaderProps\n{\n accessor listSlot: TableHeaderProps['listSlot'];\n accessor format: TableHeaderProps['format'];\n constructor();\n}" + "value": "declare class TableHeader\n extends PolarisCustomElement\n implements TableHeaderProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The slot where this header's data appears when the table is shown in list view.\n */\n listSlot: TableHeaderProps['listSlot'];\n /**\n * The format of the header and its corresponding cells.\n */\n format: TableHeaderProps['format'];\n constructor();\n}" }, "TableHeaderRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeaderRow", - "description": "The table header row component represents the header row of a table, containing column headings. Use table header row as the first child of table (before table body) to define the table structure and provide column labels.\n\nTable header row must contain table header components for each column. These headers provide context for the data columns and can support sorting functionality.", - "isPublicDocs": true, + "description": "A component that wraps the header row of a table, which contains the table header components that define the column structure.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -32486,6 +36484,21 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -32515,7 +36528,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -32523,24 +36536,194 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeaderRow\n extends PreactCustomElement\n implements TableHeaderRowProps\n{\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class TableHeaderRow\n extends PolarisCustomElement\n implements TableHeaderRowProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "TableRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableRow", - "description": "The table row component represents a single row of data within a table body. Use table row as a child of table body to structure individual records or entries in the table.\n\nTable row must contain table cell components, with each cell representing a data value for the corresponding column. The number of cells should match the number of headers in the table.", - "isPublicDocs": true, + "description": "A component that represents a single row in a table, which contains the data cells.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "clickDelegate", "value": "string", - "description": "The ID of an interactive element, such as `s-link`, in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally." + "description": "A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class TableRow extends PolarisCustomElement implements TableRowProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /**\n * A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector.\n */\n clickDelegate: string;\n}" + }, + "Text": { + "filePath": "src/surfaces/admin/components.ts", + "name": "Text", + "description": "A custom element for displaying inline or small blocks of text with various visual styles and semantic meanings. Use Text to render short pieces of content with appropriate styling, emphasis, and color treatment.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the text.", + "defaultValue": "'auto' - inherit from the parent element" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color of the text.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "type", + "value": "\"strong\" | \"generic\" | \"address\" | \"redundant\"", + "description": "The semantic type and styling treatment for the text content.\n\n- `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n- `generic`: Standard text with no special semantic meaning or styling.\n- `address`: Marks the text as contact information, such as a physical or email address.\n- `redundant`: Indicates the text is redundant or duplicated information for screen reader context.", + "defaultValue": "'generic'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "dir", + "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", + "description": "The text direction (left-to-right or right-to-left).", + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "accessibilityVisibility", + "value": "\"visible\" | \"hidden\" | \"exclusive\"", + "description": "The visibility of the element to assistive technologies.", + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "interestFor", + "value": "string", + "description": "The ID of an element this text provides contextual information for." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -32587,7 +36770,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -32595,144 +36778,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class TableRow extends PreactCustomElement implements TableRowProps {\n constructor();\n accessor clickDelegate: string;\n}" - }, - "Text": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Text", - "description": "Configure the following properties on the text component.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", - "defaultValue": "'auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "type", - "value": "\"strong\" | \"generic\" | \"address\" | \"redundant\"", - "description": "The semantic type and styling treatment for the text content.\n\n- `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n- `generic`: Standard text with no special semantic meaning or styling.\n- `address`: Marks the text as contact information, such as a physical or email address.\n- `redundant`: Indicates the text is redundant or duplicated information for screen reader context.", - "defaultValue": "'generic'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "dir", - "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", - "defaultValue": "''" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "accessibilityVisibility", - "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", - "defaultValue": "'visible'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", + "name": "__@flushRenderSymbol@16092", "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Text extends PreactCustomElement implements TextProps {\n accessor fontVariantNumeric: TextProps['fontVariantNumeric'];\n accessor color: TextProps['color'];\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: TextProps['tone'];\n /**\n * The semantic type and styling treatment for the text content.\n *\n * - `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n * - `generic`: Standard text with no special semantic meaning or styling.\n * - `address`: Marks the text as contact information, such as a physical or email address.\n * - `redundant`: Indicates the text is redundant or duplicated information for screen reader context.\n */\n accessor type: TextProps['type'];\n accessor dir: TextProps['dir'];\n accessor accessibilityVisibility: TextProps['accessibilityVisibility'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Text extends TextBase implements TextProps {\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: TextProps['tone'];\n constructor();\n}" }, "TextArea": { "filePath": "src/surfaces/admin/components.ts", "name": "TextArea", - "description": "Configure the following properties on the text area component.", - "isPublicDocs": true, + "description": "The text area custom element class that renders a multi-line text input field in the Shopify admin interface. This component allows merchants to enter and edit longer text content with support for labels, validation, and length constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -32740,7 +36817,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, { @@ -32748,22 +36825,15 @@ "syntaxKind": "PropertyDeclaration", "name": "rows", "value": "number", - "description": "A number of visible text lines.", + "description": "The number of visible text lines for the field, controlling its initial height.", "defaultValue": "2" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -32771,35 +36841,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -32807,14 +36877,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -32822,7 +36892,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -32846,7 +36916,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -32870,7 +36940,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -32878,23 +36948,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -32932,7 +37016,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -32940,24 +37024,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextArea\n extends PreactFieldElement\n implements TextAreaProps\n{\n accessor maxLength: TextAreaProps['maxLength'];\n accessor minLength: TextAreaProps['minLength'];\n accessor rows: TextAreaProps['rows'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextArea extends TextAreaBase implements TextAreaProps {\n constructor();\n}" }, "TextField": { "filePath": "src/surfaces/admin/components.ts", "name": "TextField", - "description": "Configure the following properties on the text field component.", - "isPublicDocs": true, + "description": "The text field custom element class that renders a single-line text input field in the Shopify admin interface. This component allows merchants to enter and edit text with support for labels, validation, icons, and prefix/suffix content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\" | AnyString", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "value": "IconType | AnyString", + "description": "An icon to display at the start of the text field, providing visual context for the input. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", "defaultValue": "''" }, { @@ -32965,7 +37063,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the merchant can enter in the field. When this limit is reached, the field prevents further input.", "defaultValue": "Infinity" }, { @@ -32973,7 +37071,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation. The field will be considered invalid if the merchant enters fewer characters than this value.", "defaultValue": "0" }, { @@ -32981,7 +37079,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the merchant's input, such as a currency symbol (`$`) or protocol (`https://`).", "defaultValue": "''" }, { @@ -32989,22 +37087,15 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the merchant's input, such as a unit of measurement (`kg`, `%`) or domain (`.myshopify.com`).", "defaultValue": "''" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -33012,35 +37103,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -33048,14 +37139,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -33063,7 +37154,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -33087,7 +37178,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -33111,7 +37202,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -33119,23 +37210,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -33173,7 +37278,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -33181,41 +37286,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextField\n extends PreactFieldElement\n implements TextFieldProps\n{\n accessor icon: TextFieldProps['icon'];\n accessor maxLength: TextFieldProps['maxLength'];\n accessor minLength: TextFieldProps['minLength'];\n accessor prefix: TextFieldProps['prefix'];\n accessor suffix: TextFieldProps['suffix'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextField extends TextFieldBase implements TextFieldProps {\n constructor();\n}" }, "Thumbnail": { "filePath": "src/surfaces/admin/components.ts", "name": "Thumbnail", - "description": "Configure the following properties on the thumbnail component.", - "isPublicDocs": true, + "description": "A thumbnail displays a small preview image with configurable sizing.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display in the thumbnail." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the product thumbnail image.\n\n- `small-200`: Smallest thumbnail size, ideal for compact product lists or tables.\n- `small-100`: Very small thumbnail, suitable for dense layouts.\n- `small`: Small thumbnail for space-constrained contexts.\n- `base`: Default size that balances visibility and space efficiency.\n- `large`: Larger thumbnail for featured products or detailed views.\n- `large-100`: Extra large thumbnail for prominent product display.", + "description": "The size of the thumbnail.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -33261,7 +37387,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -33269,22 +37395,36 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Thumbnail extends PreactCustomElement implements ThumbnailProps {\n accessor src: ThumbnailProps['src'];\n accessor alt: ThumbnailProps['alt'];\n accessor size: ThumbnailProps['size'];\n constructor();\n}" + "value": "declare class Thumbnail extends PolarisCustomElement implements ThumbnailProps {\n /**\n * The URL of the image to display in the thumbnail.\n */\n src: ThumbnailProps['src'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ThumbnailProps['alt'];\n /**\n * The size of the thumbnail.\n */\n size: ThumbnailProps['size'];\n constructor();\n}" }, "Tooltip": { "filePath": "src/surfaces/admin/components.ts", "name": "Tooltip", - "description": "Configure the following properties on the tooltip component.", - "isPublicDocs": true, + "description": "A component that displays a small popup with explanatory text when the user hovers over or focuses on an element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -33292,7 +37432,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -33300,11 +37440,104 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Tooltip extends PreactOverlayElement implements TooltipProps {\n constructor();\n}" + }, + "UnorderedList": { + "filePath": "src/surfaces/admin/components.ts", + "name": "UnorderedList", + "description": "A custom element for displaying a bulleted list of items where the order doesn't matter. Use unordered list when you have a collection of related items without a specific sequence, such as features, options, or bullet points.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -33350,7 +37583,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -33358,97 +37591,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - } - ], - "value": "declare class Tooltip extends PreactOverlayElement implements TooltipProps {\n constructor();\n}" - }, - "UnorderedList": { - "filePath": "src/surfaces/admin/components.ts", - "name": "UnorderedList", - "description": "Configure the following properties on the unordered list component.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "queueRender", + "name": "__@flushRenderSymbol@16092", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class UnorderedList\n extends PreactCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" + "value": "declare class UnorderedList\n extends PolarisCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" }, "URLField": { "filePath": "src/surfaces/admin/components.ts", "name": "URLField", - "description": "Configure the following properties on the URL field component.", - "isPublicDocs": true, + "description": "The URL field custom element class that renders a URL input field in the Shopify admin interface. This component allows merchants to enter web addresses with automatic URL validation and appropriate mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | `section-${string} url` | `section-${string} photo` | `section-${string} impp` | `section-${string} home impp` | `section-${string} mobile impp` | `section-${string} fax impp` | `section-${string} pager impp` | \"shipping url\" | \"shipping photo\" | \"shipping impp\" | \"shipping home impp\" | \"shipping mobile impp\" | \"shipping fax impp\" | \"shipping pager impp\" | \"billing url\" | \"billing photo\" | \"billing impp\" | \"billing home impp\" | \"billing mobile impp\" | \"billing fax impp\" | \"billing pager impp\" | `section-${string} shipping url` | `section-${string} shipping photo` | `section-${string} shipping impp` | `section-${string} shipping home impp` | `section-${string} shipping mobile impp` | `section-${string} shipping fax impp` | `section-${string} shipping pager impp` | `section-${string} billing url` | `section-${string} billing photo` | `section-${string} billing impp` | `section-${string} billing home impp` | `section-${string} billing mobile impp` | `section-${string} billing fax impp` | `section-${string} billing pager impp` | URLAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint about the intended content of the field for browser autofill.", + "defaultValue": "'url'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the URL.", "defaultValue": "Infinity" }, { @@ -33456,50 +37638,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the URL.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -33507,14 +37682,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -33522,7 +37697,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -33546,7 +37721,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -33570,7 +37745,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -33578,23 +37753,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -33632,7 +37821,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -33640,41 +37829,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class URLField\n extends PreactFieldElement\n implements URLFieldProps\n{\n accessor autocomplete: URLFieldProps['autocomplete'];\n accessor maxLength: URLFieldProps['maxLength'];\n accessor minLength: URLFieldProps['minLength'];\n /**\n * The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class URLField extends URLFieldBase implements URLFieldProps {\n constructor();\n}" }, "URLAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "URLAutocompleteField", "value": "'url' | 'photo' | 'impp' | 'home impp' | 'mobile impp' | 'fax impp' | 'pager impp'", - "description": "Represents autocomplete values that are valid for URL input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for URL inputs.\n\nAvailable values:\n- `url` - General URL or web address\n- `photo` - URL to a photo or image\n- `impp` - Instant messaging protocol URL\n- `home impp` - Home instant messaging protocol URL\n- `mobile impp` - Mobile instant messaging protocol URL\n- `fax impp` - Fax instant messaging protocol URL\n- `pager impp` - Pager instant messaging protocol URL", - "isPublicDocs": true + "description": "" }, "AdminAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminAction", - "description": "Configure the following properties on the admin action component.", - "isPublicDocs": true, + "description": "The admin action custom element class that renders action controls in the Shopify admin interface. This component creates a standardized action area with a heading and slots for primary and secondary action buttons, used exclusively in admin action extensions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text to use as the Action modal's title. If not provided, the name of the extension will be used." + "description": "The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the action is in a loading state, such as during initial page load or when the action is being opened. When `true`, the action might be in an inert state that prevents user interaction.", + "description": "Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -33720,7 +37929,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -33728,11 +37937,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminAction\n extends PreactCustomElement\n implements AdminActionProps\n{\n /**\n * The text to use as the Action modal's title. If not provided, the name of the extension will be used.\n */\n heading: string;\n /**\n * Whether the action is in a loading state, such as during initial page load or when the action is being opened.\n * When `true`, the action might be in an inert state that prevents user interaction.\n */\n loading: boolean;\n constructor();\n}" + "value": "declare class AdminAction\n extends PolarisCustomElement\n implements AdminActionProps\n{\n /**\n * The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading.\n */\n heading: string;\n /**\n * Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.\n *\n * @default false\n */\n loading: boolean;\n constructor();\n}" }, "RunnableExtension": { "filePath": "src/extension.ts", @@ -33945,22 +38169,28 @@ "AdminBlock": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminBlock", - "description": "Configure the following properties on the admin block component.", - "isPublicDocs": true, + "description": "The admin block custom element class that renders a collapsible content block in the Shopify admin interface. This component organizes content into expandable sections with headings and provides a summary when collapsed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text displayed as the block's title in the header. If not provided, the extension name will be used." + "description": "The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "collapsedSummary", "value": "string", - "description": "The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated." + "description": "The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -34007,7 +38237,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -34015,18 +38245,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminBlock\n extends PreactCustomElement\n implements AdminBlockProps\n{\n /**\n * The text displayed as the block's title in the header. If not provided, the extension name will be used.\n */\n heading: string;\n /**\n * The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated.\n */\n collapsedSummary: string;\n constructor();\n}" + "value": "declare class AdminBlock\n extends PolarisCustomElement\n implements AdminBlockProps\n{\n /**\n * The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed.\n */\n heading: string;\n /**\n * The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed.\n */\n collapsedSummary: string;\n constructor();\n}" }, "Form": { "filePath": "src/surfaces/admin/components.ts", "name": "Form", - "description": "Configure the following properties on the form component.", - "isPublicDocs": true, + "description": "The form custom element class that renders a form container in the Shopify admin interface. This component manages form submission, validation, and reset behavior for collecting merchant input.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -34072,7 +38323,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -34080,11 +38331,114 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Form extends PreactCustomElement implements FormProps {\n constructor();\n}" + "value": "declare class Form extends PolarisCustomElement implements FormProps {\n constructor();\n}" + }, + "IntentRenderApi": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderApi", + "description": "The `IntentRenderApi` object provides methods for extensions that render in response to an app intent. Access the intent data to determine what action the merchant requested and use `intents.response` to resolve the intent when complete.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "auth", + "value": "Auth", + "description": "Provides methods for authenticating calls to your app backend. Use the `idToken()` method to retrieve a signed JWT token that verifies the current user's identity for secure server-side operations." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "extension", + "value": "{ target: ExtensionTarget; }", + "description": "The identifier of the running extension target. Use this to determine which target your extension is rendering in and conditionally adjust functionality or UI based on the extension context." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "i18n", + "value": "I18n", + "description": "Utilities for translating content according to the current localization of the admin. Use these methods to provide translated strings that match the merchant's language preferences, ensuring your extension is accessible to a global audience." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "intents", + "value": "IntentRenderIntents", + "description": "Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "picker", + "value": "PickerApi", + "description": "Opens a custom selection dialog with your app-specific data. Use the [Picker API](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/picker-api) to define the picker's heading, items, headers, and selection behavior. Returns a Promise that resolves to a `Picker` object with a `selected` property for accessing the merchant's selection." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "query", + "value": "(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>", + "description": "Executes GraphQL queries against the [GraphQL Admin API](/docs/api/admin-graphql). Use this to fetch shop data, manage resources, or perform mutations. Queries are automatically authenticated with the current user's permissions. Optionally specify GraphQL variables and API version for your query." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "resourcePicker", + "value": "ResourcePickerApi", + "description": "Opens the [resource picker](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/resource-picker-api) modal for selecting products, variants, or collections. Returns the selected resources when the user confirms their selection, or undefined if they cancel." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "storage", + "value": "Storage", + "description": "Provides methods for persisting data in browser storage that is scoped to your extension. Use this to store user preferences, cache data, maintain state across sessions, or save temporary working data. Storage is persistent across page reloads and isolated per extension." + } + ], + "value": "export interface IntentRenderApi\n extends StandardRenderingExtensionApi {\n /**\n * Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow.\n */\n intents: IntentRenderIntents;\n}" + }, + "IntentRenderIntents": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderIntents", + "description": "The intents API available to intent render extensions. Unlike other targets where `response` is optional, intent render extensions always run inside an intent workflow so `response` is guaranteed.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled." + } + ], + "value": "export interface IntentRenderIntents {\n /**\n * Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled.\n */\n response: IntentResponseApi;\n}" + }, + "FormExtensionComponents": { + "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "FormExtensionComponents", + "value": "StandardComponents | 'Form'", + "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." }, "StandardApi": { "filePath": "src/surfaces/admin/api/standard/standard.ts", @@ -34679,19 +39033,18 @@ "value": "FormExtensionComponents | 'FunctionSettings'", "description": "The components available for building function settings extensions. Includes all form components plus the function settings component required for function settings configuration." }, - "FormExtensionComponents": { - "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "FormExtensionComponents", - "value": "StandardComponents | 'Form'", - "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." - }, "FunctionSettings": { "filePath": "src/surfaces/admin/components.ts", "name": "FunctionSettings", - "description": "Configure the following properties on the function settings component.", - "isPublicDocs": true, + "description": "The function settings custom element class that renders a specialized form for configuring Shopify Function settings in the admin interface. This component manages function configuration submission, validation, and error handling.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -34737,7 +39090,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -34745,8 +39098,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class FunctionSettings\n extends PreactCustomElement\n implements FunctionSettingsProps\n{\n constructor();\n}" @@ -34833,15 +39201,21 @@ "AdminPrintAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminPrintAction", - "description": "Configure the following properties on the admin print action component.", - "isPublicDocs": true, + "description": "The admin print action custom element class that renders a print interface in the Shopify admin. This component enables merchants to print content from a specified source URL using the browser's print functionality.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The `src` URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs, and images are supported." + "description": "The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -34888,7 +39262,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -34896,11 +39270,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminPrintAction\n extends PreactCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The `src` URL of the preview and the document to print.\n * If not provided, the preview will show an empty state and the print button will be disabled.\n * HTML, PDFs, and images are supported.\n */\n src: string;\n constructor();\n}" + "value": "declare class AdminPrintAction\n extends PolarisCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action.\n */\n src: string;\n constructor();\n}" }, "ProductDetailsConfigurationApi": { "filePath": "src/surfaces/admin/api/product-configuration/product-details-configuration.ts", @@ -36167,7 +40556,7 @@ "filePath": "src/surfaces/admin/api/intents/intents.ts", "syntaxKind": "PropertySignature", "name": "issues", - "value": "{ path?: string[]; message?: string; code?: string; }[]", + "value": "Issue[]", "description": "Specific validation issues or field errors. Present when validation fails on particular fields, allowing you to show targeted error messages.", "isOptional": true }, @@ -36180,7 +40569,39 @@ "isOptional": true } ], - "value": "export interface ErrorIntentResponse {\n /** Indicates the workflow failed. When `'error'`, the workflow encountered validation errors or other issues that prevented completion. */\n code?: 'error';\n /** A general error message describing what went wrong. Use this to display feedback when specific field errors aren't available. */\n message?: string;\n /** Specific validation issues or field errors. Present when validation fails on particular fields, allowing you to show targeted error messages. */\n issues?: {\n /** The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure. */\n path?: string[];\n /** A description of what's wrong with this field. Display this to help merchants understand how to fix the error. */\n message?: string;\n /** A machine-readable error code for this issue. Use this for programmatic error handling or logging. */\n code?: string;\n }[];\n}" + "value": "export interface ErrorIntentResponse {\n /** Indicates the workflow failed. When `'error'`, the workflow encountered validation errors or other issues that prevented completion. */\n code?: 'error';\n /** A general error message describing what went wrong. Use this to display feedback when specific field errors aren't available. */\n message?: string;\n /** Specific validation issues or field errors. Present when validation fails on particular fields, allowing you to show targeted error messages. */\n issues?: Issue[];\n}" + }, + "Issue": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "Issue", + "description": "A structured issue describing a validation or workflow error.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "code", + "value": "string", + "description": "A machine-readable error code for this issue. Use this for programmatic error handling or logging.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "message", + "value": "string", + "description": "A description of what's wrong with this field. Display this to help merchants understand how to fix the error.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "path", + "value": "string[]", + "description": "The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure.", + "isOptional": true + } + ], + "value": "export interface Issue {\n /** The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure. */\n path?: string[];\n /** A description of what's wrong with this field. Display this to help merchants understand how to fix the error. */\n message?: string;\n /** A machine-readable error code for this issue. Use this for programmatic error handling or logging. */\n code?: string;\n}" }, "ClosedIntentResponse": { "filePath": "src/surfaces/admin/api/intents/intents.ts", @@ -37314,6 +41735,13 @@ "value": "RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >", "description": "A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options." }, + { + "filePath": "src/surfaces/admin/extension-targets.ts", + "syntaxKind": "PropertySignature", + "name": "admin.app.intent.render", + "value": "RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >", + "description": "Renders an admin extension for handling app intents." + }, { "filePath": "src/surfaces/admin/extension-targets.ts", "syntaxKind": "PropertySignature", @@ -37841,7 +42269,7 @@ "description": "A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules." } ], - "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n}" + "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n\n /**\n * Renders an admin extension for handling app intents.\n */\n 'admin.app.intent.render': RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >;\n}" }, "RenderExtension": { "filePath": "src/extension.ts", @@ -38015,9 +42443,17 @@ "value": "string | URL", "description": "The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.", + "isOptional": true } ], - "value": "export interface Intents {\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" + "value": "export interface Intents {\n /**\n * Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.\n */\n response?: IntentResponseApi;\n\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" }, "IntentInvokeApi": { "filePath": "src/surfaces/admin/api/intents/intents.ts", @@ -38027,6 +42463,67 @@ "members": [], "value": "export interface IntentInvokeApi {\n (query: IntentQuery): Promise;\n (intentURL: string, options?: IntentQueryOptions): Promise;\n}" }, + "IntentResponseApi": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "IntentResponseApi", + "description": "The `IntentResponseApi` object provides methods for resolving the current intent from within an invoked extension. This API is only present when your extension is running inside an intent workflow.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "closed", + "value": "() => Promise", + "description": "Resolves the current intent as closed without completing the workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "error", + "value": "(message: string, issues?: Issue[]) => Promise", + "description": "Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "ok", + "value": "(data?: { [key: string]: unknown; }) => Promise", + "description": "Resolves the current intent successfully. Pass output data when your intent defines a response schema." + } + ], + "value": "export interface IntentResponseApi {\n /**\n * Resolves the current intent successfully. Pass output data when your intent defines a response schema.\n */\n ok(data?: SuccessIntentResponse['data']): Promise;\n\n /**\n * Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available.\n */\n error(message: string, issues?: Issue[]): Promise;\n\n /**\n * Resolves the current intent as closed without completing the workflow.\n */\n closed(): Promise;\n}" + }, + "Issue": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "Issue", + "description": "A structured issue describing a validation or workflow error.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "code", + "value": "string", + "description": "A machine-readable error code for this issue. Use this for programmatic error handling or logging.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "message", + "value": "string", + "description": "A description of what's wrong with this field. Display this to help merchants understand how to fix the error.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "path", + "value": "string[]", + "description": "The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure.", + "isOptional": true + } + ], + "value": "export interface Issue {\n /** The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure. */\n path?: string[];\n /** A description of what's wrong with this field. Display this to help merchants understand how to fix the error. */\n message?: string;\n /** A machine-readable error code for this issue. Use this for programmatic error handling or logging. */\n code?: string;\n}" + }, "PickerApi": { "filePath": "src/surfaces/admin/api/picker/picker.ts", "name": "PickerApi", @@ -38520,29 +43017,28 @@ "Avatar": { "filePath": "src/surfaces/admin/components.ts", "name": "Avatar", - "description": "Configure the following properties on the avatar component.", - "isPublicDocs": true, + "description": "An avatar displays a user or entity image with fallback initials when the image isn't available.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "initials", "value": "string", - "description": "The initials to display in the avatar when no image is provided or fails to load. Typically one or two characters representing a person's first and last name initials, such as \"JD\" for John Doe." + "description": "The initials to display when no image is provided or if the image fails to load." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The URL or path to the avatar image. When provided, the image takes priority over `initials`. If the image fails to load or loads slowly, `initials` will be rendered as a fallback." + "description": "The URL of the avatar image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"base\" | \"large\" | \"large-200\"", - "description": "The size of the avatar image.\n\n- `small-200`: Extra small avatar, suitable for compact displays or lists with many items.\n- `small`: Small avatar, good for secondary contexts or tight layouts.\n- `base`: Default size that works well in most contexts.\n- `large`: Large avatar for emphasis or when the avatar is a focal point.\n- `large-200`: Extra large avatar for prominent display.", + "description": "The size of the avatar.", "defaultValue": "'base'" }, { @@ -38550,7 +43046,14 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the avatar for accessibility.\n\nProvides a text description of the avatar for users with assistive technology and serves as a fallback when the avatar fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an avatar, it reads this description aloud. When an avatar fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt)." + "description": "Alternative text that describes the avatar for screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -38597,7 +43100,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -38605,17 +43108,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Avatar extends PreactCustomElement implements AvatarProps {\n accessor initials: AvatarProps['initials'];\n accessor src: AvatarProps['src'];\n accessor size: AvatarProps['size'];\n accessor alt: AvatarProps['alt'];\n constructor();\n}" + "value": "declare class Avatar extends PolarisCustomElement implements AvatarProps {\n /**\n * The initials to display when no image is provided or if the image fails to load.\n */\n initials: AvatarProps['initials'];\n /**\n * The URL of the avatar image to display.\n */\n src: AvatarProps['src'];\n /**\n * The size of the avatar.\n */\n size: AvatarProps['size'];\n /**\n * Alternative text that describes the avatar for screen readers.\n */\n alt: AvatarProps['alt'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -38638,68 +43155,75 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred." + "description": "" } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" }, "Badge": { "filePath": "src/surfaces/admin/components.ts", "name": "Badge", - "description": "Configure the following properties on the badge component.", - "isPublicDocs": true, + "description": "The badge custom element class that renders status indicators in the Shopify admin interface. This component displays compact visual indicators with customizable tones, sizes, and optional icons to communicate status information to merchants.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"strong\"", - "description": "Controls the visual weight and emphasis of the badge.\n\n- `base`: Standard weight with moderate emphasis, suitable for most use cases.\n- `strong`: Increased visual weight for higher emphasis and prominence.", - "defaultValue": "'base'" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the badge to provide additional visual context or reinforce the badge's meaning. Accepts any icon name from the icon library or a custom string identifier." + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"strong\"", + "description": "The visual weight of the badge. Available options: `'base'` for standard weight or `'strong'` for increased emphasis.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the badge.\n\n- `base`: Default size suitable for most badge use cases.\n- `large`: Larger badge for increased visibility and prominence.\n- `large-100`: Extra large badge for maximum visibility in emphasized contexts.", + "description": "The size of the badge. Available options: `'base'` for standard size, `'large'` for larger size, or `'large-100'` for extra large size.", "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", - "defaultValue": "'auto'" + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -38746,7 +43270,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -38754,17 +43278,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Badge extends PreactCustomElement implements BadgeProps {\n accessor color: BadgeProps['color'];\n accessor icon: BadgeProps['icon'];\n accessor size: BadgeProps['size'];\n accessor tone: BadgeProps['tone'];\n constructor();\n}" + "value": "declare class Badge extends BadgeBase implements BadgeProps {\n /**\n * The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: BadgeProps['icon'];\n /**\n * The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.\n */\n tone: BadgeProps['tone'];\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "Banner": { "filePath": "src/surfaces/admin/components.ts", "name": "Banner", - "description": "Configure the following properties on the banner component.", - "isPublicDocs": true, + "description": "A custom element for displaying important messages and notifications.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -38779,7 +43324,7 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.", + "description": "The color tone of the banner based on its semantic meaning.", "defaultValue": "'auto'" }, { @@ -38787,7 +43332,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Controls whether the banner is visible or hidden.\n\nWhen using a controlled component pattern and the banner is `dismissible`, update this property to `true` when the `dismiss` event fires.\n\nYou can hide the banner programmatically by setting this to `true` even if it's not `dismissible`.", + "description": "Whether the banner is hidden from view.", "defaultValue": "false" }, { @@ -38795,9 +43340,16 @@ "syntaxKind": "PropertyDeclaration", "name": "dismissible", "value": "boolean", - "description": "Whether the banner displays a close button that allows users to dismiss it.\n\nWhen the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, any animation completes, and the `afterhide` event fires.", + "description": "Whether the banner can be dismissed by the user.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -38843,7 +43395,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -38851,24 +43403,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Banner extends PreactCustomElement implements BannerProps {\n accessor heading: BannerProps['heading'];\n accessor tone: BannerProps['tone'];\n accessor hidden: BannerProps['hidden'];\n accessor dismissible: BannerProps['dismissible'];\n constructor();\n}" + "value": "declare class Banner extends PolarisCustomElement implements BannerProps {\n /**\n * The heading text displayed at the top of the banner.\n */\n heading: BannerProps['heading'];\n /**\n * The color tone of the banner based on its semantic meaning.\n */\n tone: BannerProps['tone'];\n /**\n * Whether the banner is hidden from view.\n */\n hidden: BannerProps['hidden'];\n /**\n * Whether the banner can be dismissed by the user.\n */\n dismissible: BannerProps['dismissible'];\n constructor();\n}" }, "Box": { "filePath": "src/surfaces/admin/components.ts", "name": "Box", - "description": "Configure the following properties on the box component.", - "isPublicDocs": true, + "description": "A box is a container component that provides control over layout, spacing, and styling.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -38876,7 +43442,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -38884,7 +43450,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -38892,7 +43458,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -38900,7 +43466,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -38908,7 +43474,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -38916,7 +43482,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -38924,7 +43490,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -38932,7 +43498,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -38940,7 +43506,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -38948,7 +43514,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -38956,7 +43522,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -38964,7 +43530,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -38972,7 +43538,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -38980,7 +43546,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -38988,7 +43554,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -38996,7 +43562,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -39016,7 +43582,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -39024,7 +43590,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -39032,7 +43598,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -39040,7 +43606,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -39048,14 +43614,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -39063,9 +43629,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -39111,7 +43684,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -39119,8 +43692,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Box extends BoxElement implements BoxProps {\n constructor();\n}" @@ -39129,120 +43717,106 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -39250,60 +43824,60 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "Button": { "filePath": "src/surfaces/admin/components.ts", "name": "Button", - "description": "Configure the following properties on the button component.", - "isPublicDocs": true, + "description": "The button custom element class that renders interactive buttons in the Shopify admin interface. This component triggers actions or navigation when clicked, with customizable visual styles, states, and optional icons.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", - "defaultValue": "false" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier." + "name": "variant", + "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", + "description": "The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.", + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "loading", - "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", - "defaultValue": "false" + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "variant", - "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "defaultValue": "'auto'" + "name": "disabled", + "value": "boolean", + "description": "Whether the button is disabled, preventing any interaction. When `true`, the button appears visually disabled and doesn't respond to user clicks.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" + "name": "loading", + "value": "boolean", + "description": "Whether the button is in a loading state. When `true`, displays a loading indicator and prevents interaction to show that an action is in progress.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to open the linked document when the button acts as a link. Available options: `''`, `'_blank'`, `'_self'`, `'_parent'`, or `'_top'`.", "defaultValue": "'auto'" }, { @@ -39311,21 +43885,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "A URL that the button should navigate to when clicked. When provided, the button behaves as a link." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Prompts the user to save the linked URL as a file with the specified filename. Only works when `href` is provided." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The button's behavior in forms. Available options: `'button'`, `'submit'`, or `'reset'`.", "defaultValue": "'button'" }, { @@ -39333,117 +43907,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", - "defaultValue": "'--auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "A text description of the button's purpose for screen readers. This is essential for accessibility when the button doesn't have visible text." }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." - } - ], - "value": "declare class Button extends Button_base implements ButtonProps {\n accessor disabled: ButtonProps['disabled'];\n accessor icon: ButtonProps['icon'];\n accessor loading: ButtonProps['loading'];\n accessor variant: ButtonProps['variant'];\n accessor tone: ButtonProps['tone'];\n accessor target: ButtonProps['target'];\n accessor href: ButtonProps['href'];\n accessor download: ButtonProps['download'];\n accessor type: ButtonProps['type'];\n accessor accessibilityLabel: ButtonProps['accessibilityLabel'];\n constructor();\n}" - }, - "AnyString": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "AnyString", - "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true - }, - "ButtonGroup": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ButtonGroup", - "description": "Configure the following properties on the button group component.", - "isPublicDocs": true, - "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "gap", - "value": "\"base\" | \"none\"", - "description": "The spacing between buttons in the group.\n\n- `base`: Standard spacing that provides clear visual separation between buttons.\n- `none`: No spacing, creating a connected button group.", - "defaultValue": "'base'" + "name": "inlineSize", + "value": "\"auto\" | \"fill\" | \"fit-content\"", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -39490,7 +43969,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -39498,39 +43977,197 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle'", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", + "defaultValue": "'--auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "commandFor", + "value": "string", + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", + "value": "string", + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class ButtonGroup\n extends PreactCustomElement\n implements ButtonGroupProps\n{\n accessor gap: ButtonGroupProps['gap'];\n accessor accessibilityLabel: ButtonGroupProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Button\n extends ButtonBase\n implements ButtonProps\n{\n /**\n * The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: ButtonProps['icon'];\n /**\n * The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.\n */\n variant: ButtonProps['variant'];\n /**\n * The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.\n */\n tone: ButtonProps['tone'];\n constructor();\n}" + }, + "AnyString": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "AnyString", + "value": "string & {}", + "description": "Prevents widening string literal types in a union to `string`." + }, + "ButtonGroup": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ButtonGroup", + "description": "A button group that arranges multiple buttons together with consistent spacing and semantic grouping for related actions.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "gap", + "value": "\"base\" | \"none\"", + "description": "The amount of spacing between buttons in the group, affecting the visual separation of actions.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that's only visible to screen readers, describing the purpose of this group of buttons." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class ButtonGroup extends ButtonGroupBase implements ButtonGroupProps {\n constructor();\n}" }, "Checkbox": { "filePath": "src/surfaces/admin/components.ts", "name": "Checkbox", - "description": "Configure the following properties on the checkbox component.", - "isPublicDocs": true, + "description": "A checkbox that lets users select or deselect an option, with support for an indeterminate state.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "indeterminate", "value": "boolean", - "description": "Whether the checkbox displays in an indeterminate state (neither checked nor unchecked), typically used to indicate partial selection in hierarchical lists.\n\nThis visual state takes priority over the `checked` prop in appearance only. The form submission value is still determined by the `checked` prop.\n\nIf `indeterminate` has not been explicitly set and hasn't been modified by user interaction, it returns the value of `defaultIndeterminate`." + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultIndeterminate", "value": "boolean", - "description": "The initial indeterminate state for uncontrolled components. Use this when you want the checkbox to start in an indeterminate state but don't need to control it afterward.\n\nThis value applies until `indeterminate` is explicitly set or the user changes the checkbox state by clicking.", + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "labelAccessibilityVisibility", + "value": "\"visible\" | \"exclusive\"", + "description": "", + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -39545,7 +44182,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -39553,28 +44190,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -39597,7 +44234,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -39605,23 +44242,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -39667,7 +44311,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -39675,24 +44319,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Checkbox extends PreactCheckboxElement implements CheckboxProps {\n get indeterminate(): CheckboxProps['indeterminate'];\n set indeterminate(indeterminate: CheckboxProps['indeterminate']);\n accessor defaultIndeterminate: CheckboxProps['defaultIndeterminate'];\n constructor();\n}" + "value": "declare class Checkbox extends CheckboxBase implements CheckboxProps {\n constructor();\n}" + }, + "CallbackEvent": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CallbackEvent", + "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." }, "Chip": { "filePath": "src/surfaces/admin/components.ts", "name": "Chip", - "description": "Configure the following properties on the chip component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "Modify the color to be more or less intense.", "defaultValue": "'base'" }, { @@ -39700,7 +44365,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -39747,7 +44427,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -39755,24 +44435,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Chip extends PreactCustomElement implements ChipProps {\n accessor color: ChipProps['color'];\n accessor accessibilityLabel: ChipProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Chip extends PolarisCustomElement implements ChipProps {\n color: ChipProps['color'];\n accessibilityLabel: ChipProps['accessibilityLabel'];\n removable: ChipProps['removable'];\n constructor(renderImpl?: Omit);\n}" }, "Choice": { "filePath": "src/surfaces/admin/components.ts", "name": "Choice", - "description": "The choice component creates individual selectable options within a choice list. Use choice to define each option that merchants can select, supporting both single selection (radio buttons) and multiple selection (checkboxes) modes.\n\nChoice components support labels, help text, and custom content through slots, providing flexible option presentation within choice lists.", - "isPublicDocs": true, + "description": "A single choice within a choice list that can be selected with a radio button or checkbox.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the choice is disabled and can't be selected.", "defaultValue": "false" }, { @@ -39780,7 +44474,7 @@ "syntaxKind": "GetAccessor", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the choice is currently selected.", "defaultValue": "false" }, { @@ -39788,21 +44482,21 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this choice is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, used when the visual label isn't descriptive enough." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the choice should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -39821,6 +44515,13 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -39850,7 +44551,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -39858,24 +44559,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Choice extends PreactCustomElement implements ChoiceProps {\n accessor disabled: ChoiceProps['disabled'];\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n accessor value: ChoiceProps['value'];\n accessor accessibilityLabel: ChoiceProps['accessibilityLabel'];\n accessor defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Choice extends PolarisCustomElement implements ChoiceProps {\n /**\n * Whether the choice is disabled and can't be selected.\n */\n disabled: ChoiceProps['disabled'];\n /**\n * Whether the choice is currently selected.\n */\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n /**\n * The value that's submitted with the form when this choice is selected.\n */\n value: ChoiceProps['value'];\n /**\n * A label that's only visible to screen readers, used when the visual label isn't descriptive enough.\n */\n accessibilityLabel: ChoiceProps['accessibilityLabel'];\n /**\n * Whether the choice should be selected when it's first rendered.\n */\n defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ChoiceList": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceList", - "description": "Configure the following properties on the choice list component.", - "isPublicDocs": true, + "description": "A list of choices that lets users select one or more options using radio buttons or checkboxes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "addEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", + "description": "Wraps change and input event listeners so they only fire when the event was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n\nThis prevents form events from elements inside secondary content (e.g. TextField, native ) from being mistakenly treated as ChoiceList value-change events, while still allowing those events to bubble normally through the DOM (preserving React's event delegation).", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "removeEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction. When `true`, the `disabled` property on any child choices is ignored.", + "description": "Whether all choices in the list are disabled and can't be selected.", "defaultValue": "false" }, { @@ -39883,43 +44614,43 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name that identifies this choice list when the form is submitted." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the choice list when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the choice list." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "multiple", "value": "boolean", - "description": "Whether multiple choices can be selected.", + "description": "Whether users can select more than one choice at a time.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the choice list is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -39927,7 +44658,7 @@ "syntaxKind": "GetAccessor", "name": "values", "value": "string[]", - "description": "An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected." + "description": "The values of the currently selected choices." }, { "filePath": "src/surfaces/admin/components.ts", @@ -39956,11 +44687,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$3@11434", + "name": "__@internals$3@16769", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -39990,7 +44728,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -39998,38 +44736,52 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ChoiceList extends BaseClass$3 implements ChoiceListProps {\n accessor disabled: ChoiceListProps['disabled'];\n accessor name: ChoiceListProps['name'];\n accessor error: ChoiceListProps['error'];\n accessor details: ChoiceListProps['details'];\n accessor multiple: ChoiceListProps['multiple'];\n accessor label: ChoiceListProps['label'];\n accessor labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class ChoiceList extends BaseClass$1 implements ChoiceListProps {\n /**\n * Wraps change and input event listeners so they only fire when the event\n * was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n *\n * This prevents form events from elements inside secondary content (e.g.\n * TextField, native ) from being mistakenly treated as ChoiceList\n * value-change events, while still allowing those events to bubble normally\n * through the DOM (preserving React's event delegation).\n * @private\n */\n addEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n\n /** @private */\n removeEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: EventListenerOptions | boolean,\n ): void;\n\n /**\n * Whether all choices in the list are disabled and can't be selected.\n */\n disabled: ChoiceListProps['disabled'];\n /**\n * The name that identifies this choice list when the form is submitted.\n */\n name: ChoiceListProps['name'];\n /**\n * An error message that's displayed below the choice list when validation fails.\n */\n error: ChoiceListProps['error'];\n /**\n * Additional text to provide context or guidance for the choice list.\n */\n details: ChoiceListProps['details'];\n /**\n * Whether users can select more than one choice at a time.\n */\n multiple: ChoiceListProps['multiple'];\n /**\n * The text that describes what the choice list is for.\n */\n label: ChoiceListProps['label'];\n /**\n * Controls whether the label is visible to all users or only to screen readers.\n */\n labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n /**\n * The values of the currently selected choices.\n */\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "Clickable": { "filePath": "src/surfaces/admin/components.ts", "name": "Clickable", - "description": "Configure the following properties on the clickable component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the component is disabled, preventing clicks and focus. When disabled, the `click` event won't fire and click events from child elements stop propagating immediately. Interactive child elements can still receive focus and be interacted with. This doesn't apply visual styling by default. You shouldapply disabled styling as needed." + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the component is in a loading state, which indicates to assistive technology that an action is in progress and prevents interaction." + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -40037,21 +44789,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "defaultValue": "'button'" }, { @@ -40059,7 +44811,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -40067,7 +44819,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -40075,7 +44827,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -40083,7 +44835,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -40091,7 +44843,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -40099,7 +44851,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -40107,7 +44859,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -40115,7 +44867,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -40123,7 +44875,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -40131,7 +44883,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -40139,7 +44891,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -40147,7 +44899,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -40155,7 +44907,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -40163,7 +44915,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -40171,7 +44923,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -40179,7 +44931,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -40187,7 +44939,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -40207,7 +44959,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -40215,7 +44967,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -40223,7 +44975,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -40231,7 +44983,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -40239,14 +44991,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -40254,9 +45006,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -40302,7 +45061,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -40310,15 +45069,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -40326,30 +45100,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n accessor disabled: ClickableProps['disabled'];\n accessor loading: ClickableProps['loading'];\n accessor target: ClickableProps['target'];\n accessor href: ClickableProps['href'];\n accessor download: ClickableProps['download'];\n accessor type: ClickableProps['type'];\n constructor();\n}" + "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n disabled: ClickableProps['disabled'];\n loading: ClickableProps['loading'];\n target: ClickableProps['target'];\n href: ClickableProps['href'];\n download: ClickableProps['download'];\n type: ClickableProps['type'];\n constructor();\n}" }, "ClickableChip": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChip", - "description": "Configure the following properties on the clickable chip component.", - "isPublicDocs": true, + "description": "A custom element for displaying interactive chips that can be clicked or removed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "The color of the chip.", "defaultValue": "'base'" }, { @@ -40357,14 +45130,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the chip for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "removable", "value": "boolean", - "description": "Whether the chip displays a remove button for dismissal. When clicked, the `remove` callback fires.", + "description": "Whether the chip can be removed by the user.", "defaultValue": "false" }, { @@ -40372,7 +45145,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Whether the chip is hidden from view. When using controlled component pattern with `removable` chips, update this property when the `remove` event fires. For non-removable chips, manually toggle this property to show or hide the chip.", + "description": "Whether the chip is hidden from view.", "defaultValue": "false" }, { @@ -40380,7 +45153,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the chip is disabled, preventing any user interaction.", + "description": "Whether the chip is disabled and can't be clicked.", "defaultValue": "false" }, { @@ -40388,7 +45161,14 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to navigate to when the chip is clicked." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -40435,7 +45215,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -40443,15 +45223,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -40459,30 +45254,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class ClickableChip\n extends ClickableChip_base\n implements ClickableChipProps\n{\n accessor color: ClickableChipProps['color'];\n accessor accessibilityLabel: ClickableChipProps['accessibilityLabel'];\n accessor removable: ClickableChipProps['removable'];\n accessor hidden: ClickableChipProps['hidden'];\n accessor disabled: ClickableChipProps['disabled'];\n accessor href: ClickableChipProps['href'];\n constructor();\n}" + "value": "declare class ClickableChip\n extends ClickableChipBase\n implements ClickableChipProps\n{\n /**\n * The color of the chip.\n */\n color: ClickableChipProps['color'];\n constructor();\n}" }, "ColorField": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorField", - "description": "Configure the following properties on the color field component.", - "isPublicDocs": true, + "description": "The color field custom element class that renders a color input field with integrated visual picker in the Shopify admin interface. This component allows merchants to select colors by typing hex values or using an interactive color picker, with optional support for transparency (alpha channel).", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -40490,7 +45284,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", @@ -40513,7 +45307,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\"", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -40521,35 +45315,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -40557,14 +45351,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -40572,7 +45366,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -40596,7 +45390,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -40612,7 +45406,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -40620,23 +45414,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -40674,7 +45475,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -40682,24 +45483,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ColorField\n extends PreactFieldElement\n implements ColorFieldProps\n{\n accessor alpha: ColorFieldProps['alpha'];\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n setInternalValue(value: string, normalize: boolean): void;\n}" + "value": "declare class ColorField extends ColorFieldBase implements ColorFieldProps {\n constructor();\n}" }, "ColorPicker": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorPicker", - "description": "Configure the following properties on the color picker component.", - "isPublicDocs": true, + "description": "A visual color picker component that allows users to select colors from a color spectrum interface.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -40707,154 +45522,138 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial color value when the field first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts interacting, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", "name": "formResetCallback", "value": "() => void", - "description": "A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@internals$2@11535", - "value": "ElementInternals", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", "description": "", "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true } ], - "value": "declare class ColorPicker extends BaseClass$2 implements ColorPickerProps {\n accessor alpha: boolean;\n accessor name: string;\n accessor defaultValue: string;\n get value(): string;\n set value(value: string);\n /**\n * A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`.\n */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class ColorPicker extends BaseClass implements ColorPickerProps {\n /**\n * Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.\n *\n * @default false\n */\n alpha: boolean;\n /**\n * The name of the picker, used when submitting form data.\n */\n name: string;\n /**\n * The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n defaultValue: string;\n /**\n * The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n}" }, "DateField": { "filePath": "src/surfaces/admin/components.ts", "name": "DateField", - "description": "Configure the following properties on the date field component.", - "isPublicDocs": true, + "description": "The date field custom element class that renders a date input field with integrated calendar picker in the Shopify admin interface. This component allows merchants to select dates by typing or using a visual calendar, with support for date range restrictions and day-of-week constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar picker, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar picker first opens, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "DateAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -40862,36 +45661,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "defaultValue": "\"\"" + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -40899,14 +45697,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -40914,7 +45712,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -40938,7 +45736,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -40962,7 +45760,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -40970,31 +45768,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected date in `YYYY-MM-DD` format. An empty string means no date is selected.", - "defaultValue": "\"\"" + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -41032,7 +45836,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -41040,78 +45844,139 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DateField\n extends PreactFieldElement\n implements DateFieldProps\n{\n accessor allow: DateFieldProps['allow'];\n accessor disallow: DateFieldProps['disallow'];\n accessor allowDays: DateFieldProps['allowDays'];\n accessor disallowDays: DateFieldProps['disallowDays'];\n set view(view: string);\n get view(): string;\n accessor defaultView: DateFieldProps['defaultView'];\n constructor();\n}" + "value": "declare class DateField extends DateFieldBase implements DateFieldProps {\n constructor();\n}" }, "DateAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "DateAutocompleteField", "value": "'bday-day' | 'bday-month' | 'bday-year' | 'bday' | 'cc-expiry-month' | 'cc-expiry-year' | 'cc-expiry'", - "description": "Represents autocomplete values that are valid for date input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for date-based inputs.\n\nAvailable values:\n- `bday` - Complete birthday date\n- `bday-day` - Day component of a birthday (1-31)\n- `bday-month` - Month component of a birthday (1-12)\n- `bday-year` - Year component of a birthday (1990)\n- `cc-expiry` - Complete credit card expiration date\n- `cc-expiry-month` - Month component of a credit card expiration date (1-12)\n- `cc-expiry-year` - Year component of a credit card expiration date (2025)", - "isPublicDocs": true + "description": "" }, "DatePicker": { "filePath": "src/surfaces/admin/components.ts", "name": "DatePicker", - "description": "Configure the following properties on the date picker component.", - "isPublicDocs": true, + "description": "The date picker custom element class that renders a standalone calendar interface in the Shopify admin. This component allows merchants to select single dates or date ranges using an interactive calendar with month/year navigation, date constraints, and day-of-week restrictions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar first renders, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"single\" | \"range\"", - "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "description": "The type of date selection allowed. Available values: `single`, `range`.", "defaultValue": "\"single\"" }, { @@ -41119,7 +45984,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initially selected date(s) when the component first renders. An empty string means no date is initially selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The initial selected date or date range when the picker first renders, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -41127,14 +45992,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "value", "value": "string", - "description": "The currently selected date(s). An empty string means no date is selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The currently selected date or date range, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -41148,19 +46013,26 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@dirtyStateSymbol@11579", - "value": "boolean", + "name": "__@internals$1@16931", + "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$1@11578", - "value": "ElementInternals", + "name": "__@dirtyStateSymbol@16932", + "value": "boolean", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -41206,7 +46078,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -41214,17 +46086,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DatePicker extends BaseClass$1 implements DatePickerProps {\n accessor defaultView: string;\n set view(view: string);\n get view(): string;\n accessor allow: DatePickerProps['allow'];\n accessor disallow: DatePickerProps['disallow'];\n accessor allowDays: DatePickerProps['allowDays'];\n accessor disallowDays: DatePickerProps['disallowDays'];\n accessor type: DatePickerProps['type'];\n accessor defaultValue: DatePickerProps['defaultValue'];\n accessor name: DatePickerProps['name'];\n set value(value: string);\n get value(): string;\n /** @private */\n [dirtyStateSymbol]: boolean;\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DatePicker\n extends DatePickerBase\n implements DatePickerProps\n{\n constructor();\n}" }, "DropZone": { "filePath": "src/surfaces/admin/components.ts", "name": "DropZone", - "description": "Configure the following properties on the drop zone component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -41246,29 +46132,29 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -41284,14 +46170,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -41321,7 +46207,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@setFiles@11614", + "name": "__@setFiles@16968", "value": "(files: File[]) => void", "description": "", "isPrivate": true @@ -41329,7 +46215,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@getFileInput@11616", + "name": "__@getFileInput@16970", "value": "() => HTMLInputElement", "description": "", "isPrivate": true @@ -41337,11 +46223,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals@11615", + "name": "__@internals@16969", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -41387,7 +46280,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -41395,17 +46288,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DropZone extends BaseClass implements DropZoneProps {\n accessor accept: DropZoneProps['accept'];\n accessor accessibilityLabel: DropZoneProps['accessibilityLabel'];\n accessor disabled: DropZoneProps['disabled'];\n accessor error: DropZoneProps['error'];\n accessor label: DropZoneProps['label'];\n accessor labelAccessibilityVisibility: DropZoneProps['labelAccessibilityVisibility'];\n accessor multiple: DropZoneProps['multiple'];\n accessor name: DropZoneProps['name'];\n accessor required: DropZoneProps['required'];\n get value(): string;\n /** This sets the input value for a file type, which cannot be set programatically, so it can only be reset. */\n set value(value: '' | null);\n get files(): File[];\n set files(files: File[]);\n /** @private */\n [setFiles](files: File[]): void;\n /** @private */\n [getFileInput](): ReplaceType<\n Element | null | undefined,\n Element,\n HTMLInputElement\n >;\n\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DropZone extends DropZoneBase implements DropZoneProps {\n constructor();\n}" }, "Divider": { "filePath": "src/surfaces/admin/components.ts", "name": "Divider", - "description": "Configure the following properties on the divider component.", - "isPublicDocs": true, + "description": "A divider is a visual separator that creates a line between different sections of content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -41423,6 +46330,13 @@ "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -41468,7 +46382,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -41476,32 +46390,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Divider extends PreactCustomElement implements DividerProps {\n accessor direction: DividerProps['direction'];\n accessor color: DividerProps['color'];\n constructor();\n}" + "value": "declare class Divider extends PolarisCustomElement implements DividerProps {\n /**\n * The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n *\n * - `inline`: Horizontal divider for separating vertically stacked content\n * - `block`: Vertical divider for separating horizontally arranged content\n *\n * @default 'inline'\n */\n direction: DividerProps['direction'];\n /**\n * The visual prominence of the divider line.\n *\n * - `base`: Standard divider for most separations (default)\n * - `strong`: More prominent divider for major section breaks\n *\n * @default 'base'\n */\n color: DividerProps['color'];\n constructor();\n}" }, "EmailField": { "filePath": "src/surfaces/admin/components.ts", "name": "EmailField", - "description": "Configure the following properties on the email field component.", - "isPublicDocs": true, + "description": "The email field custom element class that renders an email input field in the Shopify admin interface. This component allows merchants to enter email addresses with automatic validation and optimized mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | EmailAutocompleteField | `section-${string} email` | `section-${string} home email` | `section-${string} mobile email` | `section-${string} fax email` | `section-${string} pager email` | \"shipping email\" | \"shipping home email\" | \"shipping mobile email\" | \"shipping fax email\" | \"shipping pager email\" | \"billing email\" | \"billing home email\" | \"billing mobile email\" | \"billing fax email\" | \"billing pager email\" | `section-${string} shipping email` | `section-${string} shipping home email` | `section-${string} shipping mobile email` | `section-${string} shipping fax email` | `section-${string} shipping pager email` | `section-${string} billing email` | `section-${string} billing home email` | `section-${string} billing mobile email` | `section-${string} billing fax email` | `section-${string} billing pager email`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint as to the intended content of the field for autocomplete purposes.", + "defaultValue": "'email'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -41509,50 +46437,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -41560,14 +46481,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -41575,7 +46496,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -41599,7 +46520,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -41623,7 +46544,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -41631,23 +46552,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -41685,7 +46620,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -41693,32 +46628,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class EmailField\n extends PreactFieldElement\n implements EmailFieldProps\n{\n accessor autocomplete: EmailFieldProps['autocomplete'];\n accessor maxLength: EmailFieldProps['maxLength'];\n accessor minLength: EmailFieldProps['minLength'];\n /**\n * The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class EmailField extends EmailFieldBase implements EmailFieldProps {\n constructor();\n}" }, "EmailAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "EmailAutocompleteField", "value": "'email' | 'home email' | 'mobile email' | 'fax email' | 'pager email'", - "description": "Represents autocomplete values that are valid for email input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for email inputs.\n\nAvailable values:\n- `email` - Primary email address\n- `home email` - Home email address\n- `mobile email` - Mobile device email address\n- `fax email` - Fax machine email address\n- `pager email` - Pager device email address", - "isPublicDocs": true + "description": "" }, "Grid": { "filePath": "src/surfaces/admin/components.ts", "name": "Grid", - "description": "Configure the following properties on the grid component.", - "isPublicDocs": true, + "description": "A grid is a layout component that arranges its children in rows and columns with precise control over sizing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridTemplateColumns", "value": "string", - "description": "The columns in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid columns.", "defaultValue": "'none'" }, { @@ -41726,7 +46674,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridTemplateRows", "value": "string", - "description": "The rows in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid rows.", "defaultValue": "'none'" }, { @@ -41734,7 +46682,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyItems", "value": "\"\" | JustifyItemsKeyword", - "description": "Aligns the grid items along the inline axis.", + "description": "The alignment of grid items along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -41742,7 +46690,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "\"\" | AlignItemsKeyword", - "description": "Aligns the grid items along the block axis.", + "description": "The alignment of grid items along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -41750,7 +46698,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeItems", "value": "AlignItemsKeyword | \"normal normal\" | \"normal stretch\" | \"normal baseline\" | \"normal first baseline\" | \"normal last baseline\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch baseline\" | \"stretch first baseline\" | \"stretch last baseline\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline baseline\" | \"baseline first baseline\" | \"baseline last baseline\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline baseline\" | \"first baseline first baseline\" | \"first baseline last baseline\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline baseline\" | \"last baseline first baseline\" | \"last baseline last baseline\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start baseline\" | \"start first baseline\" | \"start last baseline\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end baseline\" | \"end first baseline\" | \"end last baseline\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center baseline\" | \"center first baseline\" | \"center last baseline\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start baseline\" | \"unsafe start first baseline\" | \"unsafe start last baseline\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end baseline\" | \"unsafe end first baseline\" | \"unsafe end last baseline\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center baseline\" | \"unsafe center first baseline\" | \"unsafe center last baseline\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start baseline\" | \"safe start first baseline\" | \"safe start last baseline\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end baseline\" | \"safe end first baseline\" | \"safe end last baseline\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center baseline\" | \"safe center first baseline\" | \"safe center last baseline\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\"", - "description": "A shorthand property for `justify-items` and `align-items`.", + "description": "A shorthand for setting both `alignItems` and `justifyItems`.", "defaultValue": "'normal normal'" }, { @@ -41758,7 +46706,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "\"\" | JustifyContentKeyword", - "description": "Aligns the grid along the inline axis. This overrides the inline value of `placeContent`.", + "description": "The alignment of the grid along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -41766,7 +46714,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "\"\" | AlignContentKeyword", - "description": "Aligns the grid along the block axis. This overrides the block value of `placeContent`.", + "description": "The alignment of the grid along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -41774,7 +46722,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeContent", "value": "\"normal normal\" | \"normal stretch\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\" | AlignContentKeyword | \"normal space-between\" | \"normal space-around\" | \"normal space-evenly\" | \"baseline space-between\" | \"baseline space-around\" | \"baseline space-evenly\" | \"first baseline space-between\" | \"first baseline space-around\" | \"first baseline space-evenly\" | \"last baseline space-between\" | \"last baseline space-around\" | \"last baseline space-evenly\" | \"start space-between\" | \"start space-around\" | \"start space-evenly\" | \"end space-between\" | \"end space-around\" | \"end space-evenly\" | \"center space-between\" | \"center space-around\" | \"center space-evenly\" | \"unsafe start space-between\" | \"unsafe start space-around\" | \"unsafe start space-evenly\" | \"unsafe end space-between\" | \"unsafe end space-around\" | \"unsafe end space-evenly\" | \"unsafe center space-between\" | \"unsafe center space-around\" | \"unsafe center space-evenly\" | \"safe start space-between\" | \"safe start space-around\" | \"safe start space-evenly\" | \"safe end space-between\" | \"safe end space-around\" | \"safe end space-evenly\" | \"safe center space-between\" | \"safe center space-around\" | \"safe center space-evenly\" | \"stretch space-between\" | \"stretch space-around\" | \"stretch space-evenly\" | \"space-between normal\" | \"space-between start\" | \"space-between end\" | \"space-between center\" | \"space-between unsafe start\" | \"space-between unsafe end\" | \"space-between unsafe center\" | \"space-between safe start\" | \"space-between safe end\" | \"space-between safe center\" | \"space-between stretch\" | \"space-between space-between\" | \"space-between space-around\" | \"space-between space-evenly\" | \"space-around normal\" | \"space-around start\" | \"space-around end\" | \"space-around center\" | \"space-around unsafe start\" | \"space-around unsafe end\" | \"space-around unsafe center\" | \"space-around safe start\" | \"space-around safe end\" | \"space-around safe center\" | \"space-around stretch\" | \"space-around space-between\" | \"space-around space-around\" | \"space-around space-evenly\" | \"space-evenly normal\" | \"space-evenly start\" | \"space-evenly end\" | \"space-evenly center\" | \"space-evenly unsafe start\" | \"space-evenly unsafe end\" | \"space-evenly unsafe center\" | \"space-evenly safe start\" | \"space-evenly safe end\" | \"space-evenly safe center\" | \"space-evenly stretch\" | \"space-evenly space-between\" | \"space-evenly space-around\" | \"space-evenly space-evenly\"", - "description": "A shorthand property for `justify-content` and `align-content`.", + "description": "A shorthand for setting both `alignContent` and `justifyContent`.", "defaultValue": "'normal normal'" }, { @@ -41782,7 +46730,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows and columns.", "defaultValue": "'none'" }, { @@ -41790,7 +46738,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "s spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows.", "defaultValue": "'' - meaning no override" }, { @@ -41798,7 +46746,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid columns.", "defaultValue": "'' - meaning no override" }, { @@ -41806,7 +46754,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -41814,7 +46762,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -41822,7 +46770,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -41830,7 +46778,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -41838,7 +46786,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -41846,7 +46794,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -41854,7 +46802,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -41862,7 +46810,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -41870,7 +46818,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -41878,7 +46826,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -41886,7 +46834,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -41894,7 +46842,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -41902,7 +46850,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -41910,7 +46858,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -41918,7 +46866,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -41926,7 +46874,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -41934,7 +46882,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -41954,7 +46902,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -41962,7 +46910,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -41970,7 +46918,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -41978,7 +46926,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -41986,14 +46934,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -42001,9 +46949,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -42049,7 +47004,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -42057,96 +47012,101 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n accessor gridTemplateColumns: GridProps['gridTemplateColumns'];\n accessor gridTemplateRows: GridProps['gridTemplateRows'];\n accessor justifyItems: GridProps['justifyItems'];\n accessor alignItems: GridProps['alignItems'];\n accessor placeItems: GridProps['placeItems'];\n accessor justifyContent: GridProps['justifyContent'];\n accessor alignContent: GridProps['alignContent'];\n accessor placeContent: GridProps['placeContent'];\n accessor gap: GridProps['gap'];\n accessor rowGap: GridProps['rowGap'];\n accessor columnGap: GridProps['columnGap'];\n}" + "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n /**\n * The template that defines the grid columns.\n */\n gridTemplateColumns: GridProps['gridTemplateColumns'];\n /**\n * The template that defines the grid rows.\n */\n gridTemplateRows: GridProps['gridTemplateRows'];\n /**\n * The alignment of grid items along the inline axis.\n */\n justifyItems: GridProps['justifyItems'];\n /**\n * The alignment of grid items along the block axis.\n */\n alignItems: GridProps['alignItems'];\n /**\n * A shorthand for setting both `alignItems` and `justifyItems`.\n */\n placeItems: GridProps['placeItems'];\n /**\n * The alignment of the grid along the inline axis.\n */\n justifyContent: GridProps['justifyContent'];\n /**\n * The alignment of the grid along the block axis.\n */\n alignContent: GridProps['alignContent'];\n /**\n * A shorthand for setting both `alignContent` and `justifyContent`.\n */\n placeContent: GridProps['placeContent'];\n /**\n * The spacing between grid rows and columns.\n */\n gap: GridProps['gap'];\n /**\n * The spacing between grid rows.\n */\n rowGap: GridProps['rowGap'];\n /**\n * The spacing between grid columns.\n */\n columnGap: GridProps['columnGap'];\n}" }, "JustifyItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.\n\nLearn more about the [justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).", - "isPublicDocs": true + "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis." }, "BaselinePosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BaselinePosition", "value": "'baseline' | 'first baseline' | 'last baseline'", - "description": "Represents baseline alignment positions used to align items relative to their baselines.\n- `baseline`: Aligns to the baseline of the parent.\n- `first baseline`: Aligns to the first baseline of the parent.\n- `last baseline`: Aligns to the last baseline of the parent.", - "isPublicDocs": true + "description": "" }, "OverflowPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "OverflowPosition", "value": "`unsafe ${ContentPosition}` | `safe ${ContentPosition}`", - "description": "Represents content positioning with overflow behavior control. Use `safe` to prevent content from becoming inaccessible when it overflows, or `unsafe` to allow overflow regardless of accessibility.", - "isPublicDocs": true + "description": "" }, "ContentPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentPosition", "value": "'center' | 'start' | 'end'", - "description": "Defines the position of content along an axis.\n- `center`: Centers the content.\n- `start`: Aligns content to the start.\n- `end`: Aligns content to the end.", - "isPublicDocs": true + "description": "" }, "AlignItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Align items sets the align-self value on all direct children as a group.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isPublicDocs": true + "description": "Align items sets the align-self value on all direct children as a group." }, "JustifyContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyContentKeyword", "value": "'normal' | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", - "isPublicDocs": true + "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container." }, "ContentDistribution": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentDistribution", "value": "'space-between' | 'space-around' | 'space-evenly' | 'stretch'", - "description": "Defines how space is distributed between and around content items in flex and grid layouts.\n- `space-between`: Distributes items evenly with the first item at the start and last at the end.\n- `space-around`: Distributes items evenly with equal space around each item.\n- `space-evenly`: Distributes items evenly with equal space between them.\n- `stretch`: Stretches items to fill the container.", - "isPublicDocs": true + "description": "" }, "AlignContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignContentKeyword", "value": "'normal' | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isPublicDocs": true + "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis." }, "SpacingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SpacingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the spacing size between elements, using the standard size scale or `none` for no spacing.", - "isPublicDocs": true + "description": "" }, "GridItem": { "filePath": "src/surfaces/admin/components.ts", "name": "GridItem", - "description": "The grid item component represents a single cell within a grid layout, allowing you to control how content is positioned and sized within the grid. Use grid item as a child of grid to specify column span, row span, and positioning for individual content areas.\n\nGrid item supports precise placement control through column and row properties, enabling you to create complex layouts where different items occupy varying amounts of space or appear in specific grid positions.", - "isPublicDocs": true, + "description": "A grid item is a child of a grid that can be positioned within specific rows and columns.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridColumn", "value": "\"auto\" | `span ${number}`", - "description": "The number of columns the item will span across.\n\nLearn more about the [grid-column property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).", + "description": "The column position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -42154,7 +47114,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridRow", "value": "\"auto\" | `span ${number}`", - "description": "The number of rows the item will span across.\n\nLearn more about the [grid-row property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).", + "description": "The row position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -42162,7 +47122,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -42170,7 +47130,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -42178,7 +47138,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -42186,7 +47146,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -42194,7 +47154,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -42202,7 +47162,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -42210,7 +47170,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -42218,7 +47178,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -42226,7 +47186,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -42234,7 +47194,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -42242,7 +47202,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -42250,7 +47210,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -42258,7 +47218,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -42266,7 +47226,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -42274,7 +47234,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -42282,7 +47242,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -42290,7 +47250,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -42310,7 +47270,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -42318,7 +47278,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -42326,7 +47286,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -42334,7 +47294,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -42342,14 +47302,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -42357,9 +47317,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -42405,7 +47372,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -42413,24 +47380,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class GridItem extends BoxElement implements GridItemProps {\n accessor gridColumn: GridItemProps['gridColumn'];\n accessor gridRow: GridItemProps['gridRow'];\n constructor();\n}" + "value": "declare class GridItem extends BoxElement implements GridItemProps {\n /**\n * The column position and span of the grid item.\n */\n gridColumn: GridItemProps['gridColumn'];\n /**\n * The row position and span of the grid item.\n */\n gridRow: GridItemProps['gridRow'];\n constructor();\n}" }, "Heading": { "filePath": "src/surfaces/admin/components.ts", "name": "Heading", - "description": "Configure the following properties on the heading component.", - "isPublicDocs": true, + "description": "A custom element for displaying hierarchical section titles and headings with appropriate semantic meaning and visual styling. Use Heading to structure your content with proper heading levels for both visual hierarchy and accessibility.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"heading\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The ARIA role for the heading. Set to `'heading'` (the default) for standard heading semantics, or `'presentation'` / `'none'` to remove heading semantics for decorative use.", "defaultValue": "'heading'" }, { @@ -42438,7 +47419,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lineClamp", "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", "defaultValue": "Infinity - no truncation is applied" }, { @@ -42446,9 +47427,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -42494,7 +47482,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -42502,47 +47490,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Heading extends PreactCustomElement implements HeadingProps {\n accessor accessibilityRole: HeadingProps['accessibilityRole'];\n accessor lineClamp: HeadingProps['lineClamp'];\n accessor accessibilityVisibility: HeadingProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Heading extends HeadingBase implements HeadingProps {\n constructor();\n}" }, "Icon": { "filePath": "src/surfaces/admin/components.ts", "name": "Icon", - "description": "Configure the following properties on the icon component.", - "isPublicDocs": true, + "description": "An icon displays a graphical symbol from the icon library.", "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", + "description": "The color tone of the icon based on its semantic meaning.", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "The icon to display from the icon library.\n\nSet to a valid icon name to display that icon. To hide the icon completely, use an empty string `''`. To reserve the icon's space without displaying an icon, use `'empty'`." + "value": "\"\" | IconType", + "description": "The type of icon to display." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color emphasis of the icon.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"base\"", - "description": "The size of the icon.\n\n- `small`: Smaller icon suitable for inline use within text or compact UI elements.\n- `base`: Default size that works well for standalone icons and standard use cases.", + "description": "The size of the icon.", "defaultValue": "'base'" }, { @@ -42550,7 +47552,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The element that this icon should show interest for when activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -42597,7 +47606,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -42605,53 +47614,67 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Icon extends PreactCustomElement implements IconProps {\n accessor color: IconProps['color'];\n accessor tone: IconProps['tone'];\n accessor type: IconProps['type'];\n accessor size: IconProps['size'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Icon extends IconBase implements IconProps {\n /**\n * The color tone of the icon based on its semantic meaning.\n */\n tone: IconProps['tone'];\n /**\n * The type of icon to display.\n */\n type: IconProps['type'];\n constructor();\n}" }, "Image": { "filePath": "src/surfaces/admin/components.ts", "name": "Image", - "description": "Configure the following properties on the image component.", - "isPublicDocs": true, + "description": "An image displays pictures with configurable sizing, loading behavior, and borders.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "srcSet", "value": "string", - "description": "A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n\nLearn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset)." + "description": "A set of source images with different sizes for responsive loading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "sizes", "value": "string", - "description": "A set of media conditions and their corresponding sizes.\n\nLearn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes)." + "description": "The sizes of the image at different viewport widths." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "aspectRatio", "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", - "description": "The aspect ratio of the image.\n\nThe rendering of the image will depend on the `inlineSize` value:\n\n- `inlineSize=\"fill\"`: the aspect ratio will be respected and the image will take the necessary space.\n- `inlineSize=\"auto\"`: the image will not render until it has loaded and the aspect ratio will be ignored.\n\nFor example, if the value is set as `50 / 100`, the getter returns `50 / 100`. If the value is set as `0.5`, the getter returns `0.5 / 1`.\n\nLearn more about the [aspect-ratio property](https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio).", + "description": "The aspect ratio of the image as a width-to-height ratio.", "defaultValue": "'1/1'" }, { @@ -42659,7 +47682,7 @@ "syntaxKind": "PropertyDeclaration", "name": "objectFit", "value": "\"contain\" | \"cover\"", - "description": "The image resizing behavior to fit within its container.\n\n- `contain`: Scales the image to fit within the container while maintaining its aspect ratio. The entire image is visible, but might leave empty space.\n- `cover`: Scales the image to fill the entire container while maintaining its aspect ratio. The image might be cropped to fit.\n\nThe image is always positioned in the center of the container.\n\nLearn more about the [object-fit property](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).", + "description": "How the image should be resized to fit its container.", "defaultValue": "'contain'" }, { @@ -42667,7 +47690,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "\"eager\" | \"lazy\"", - "description": "The loading strategy for the image.\n\n- `eager`: Immediately loads the image, irrespective of its position within the visible viewport.\n- `lazy`: Delays loading the image until it approaches a specified distance from the viewport.\n\nLearn more about the [loading attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading).", + "description": "When the image should be loaded.", "defaultValue": "'eager'" }, { @@ -42675,7 +47698,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"img\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The accessibility role for the image.", "defaultValue": "'img'" }, { @@ -42683,7 +47706,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "\"auto\" | \"fill\"", - "description": "The displayed inline width of the image.\n\n- `fill`: the image will takes up 100% of the available inline size.\n- `auto`: the image will be displayed at its natural size.\n\nLearn more about the [width attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#width).", + "description": "The inline size (width in horizontal writing modes) of the image.", "defaultValue": "'fill'" }, { @@ -42691,35 +47714,23 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied around the image using shorthand syntax to specify width, color, and style in a single property.", - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "description": "Whether to show a border around the image.", + "defaultValue": "'none' - equivalent to `none base auto`." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderWidth", - "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderStyle", - "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image.", "defaultValue": "'' - meaning no override" }, { @@ -42727,17 +47738,161 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "The color of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the image's corners using the design system's radius scale.", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image.", "defaultValue": "'none'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Image extends PolarisCustomElement implements ImageProps {\n /**\n * The URL of the image to display.\n */\n src: ImageProps['src'];\n /**\n * A set of source images with different sizes for responsive loading.\n */\n srcSet: ImageProps['srcSet'];\n /**\n * The sizes of the image at different viewport widths.\n */\n sizes: ImageProps['sizes'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ImageProps['alt'];\n /**\n * The aspect ratio of the image as a width-to-height ratio.\n */\n aspectRatio: ImageProps['aspectRatio'];\n /**\n * How the image should be resized to fit its container.\n */\n objectFit: ImageProps['objectFit'];\n /**\n * When the image should be loaded.\n */\n loading: ImageProps['loading'];\n /**\n * The accessibility role for the image.\n */\n accessibilityRole: ImageProps['accessibilityRole'];\n /**\n * The inline size (width in horizontal writing modes) of the image.\n */\n inlineSize: ImageProps['inlineSize'];\n /**\n * Whether to show a border around the image.\n */\n border: ImageProps['border'];\n /**\n * The width of the border around the image.\n */\n borderWidth: ImageProps['borderWidth'];\n /**\n * The style of the border around the image.\n */\n borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image.\n */\n borderColor: ImageProps['borderColor'];\n /**\n * The radius of the border corners around the image.\n */\n borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + }, + "BorderRadiusKeyword": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "BorderRadiusKeyword", + "value": "SizeKeyword | 'max' | 'none'", + "description": "" + }, + "Link": { + "filePath": "src/surfaces/admin/components.ts", + "name": "Link", + "description": "", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "target", + "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", + "description": "Specifies where to display the linked URL.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -42783,7 +47938,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -42791,124 +47946,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Image extends PreactCustomElement implements ImageProps {\n accessor src: ImageProps['src'];\n accessor srcSet: ImageProps['srcSet'];\n accessor sizes: ImageProps['sizes'];\n accessor alt: ImageProps['alt'];\n accessor aspectRatio: ImageProps['aspectRatio'];\n accessor objectFit: ImageProps['objectFit'];\n accessor loading: ImageProps['loading'];\n accessor accessibilityRole: ImageProps['accessibilityRole'];\n accessor inlineSize: ImageProps['inlineSize'];\n /**\n * A border applied around the image using shorthand syntax to specify width, color, and style in a single property.\n */\n accessor border: ImageProps['border'];\n /**\n * The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.\n */\n accessor borderWidth: ImageProps['borderWidth'];\n /**\n * The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.\n */\n accessor borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.\n */\n accessor borderColor: ImageProps['borderColor'];\n /**\n * The roundedness of the image's corners using the design system's radius scale.\n */\n accessor borderRadius: ImageProps['borderRadius'];\n constructor();\n}" - }, - "Link": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Link", - "description": "Configure the following properties on the link component.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "href", - "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "target", - "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", - "defaultValue": "'auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "download", - "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "lang", - "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", + "name": "__@flushRenderSymbol@16092", "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -42916,24 +47977,30 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Link extends Link_base implements LinkProps {\n accessor tone: LinkProps['tone'];\n accessor accessibilityLabel: LinkProps['accessibilityLabel'];\n accessor href: LinkProps['href'];\n accessor target: LinkProps['target'];\n accessor download: LinkProps['download'];\n accessor lang: LinkProps['lang'];\n constructor();\n}" + "value": "declare class Link extends LinkBase implements LinkProps {\n tone: LinkProps['tone'];\n constructor();\n}" }, "ListItem": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItem", - "description": "The list item component represents a single entry within an ordered list or unordered list. Use list item to structure individual points, steps, or items within a list, with each item automatically receiving appropriate list markers (bullets or numbers) from its parent list.\n\nList item must be used as a direct child of ordered list or unordered list components. Each list item can contain text, inline formatting, or other components to create rich list content.", - "isPublicDocs": true, + "description": "A component that represents a single item within an ordered list or unordered list.\n\nUse list item as a child of ordered list or unordered list to create properly structured and accessible list content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -42979,7 +48046,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -42987,24 +48054,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ListItem extends PreactCustomElement implements ListItemProps {\n constructor();\n}" + "value": "declare class ListItem extends PolarisCustomElement implements ListItemProps {\n constructor();\n}" }, "Menu": { "filePath": "src/surfaces/admin/components.ts", "name": "Menu", - "description": "Configure the following properties on the menu component.", - "isPublicDocs": true, + "description": "A component that displays a contextual list of actions or options, which is typically triggered by a button or other activator element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the menu for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", @@ -43025,7 +48106,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -43033,7 +48114,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -43041,11 +48122,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -43075,7 +48163,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -43083,24 +48171,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n accessor accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n /**\n * A label that describes the menu for assistive technologies.\n */\n accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "MoneyField": { "filePath": "src/surfaces/admin/components.ts", "name": "MoneyField", - "description": "Configure the following properties on the money field component.", - "isPublicDocs": true, + "description": "The money field custom element class that renders a monetary input field in the Shopify admin interface. This component allows merchants to enter currency amounts with automatic formatting, decimal precision, and validation against minimum and maximum values.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum monetary value allowed in the field.", "defaultValue": "Infinity" }, { @@ -43108,9 +48210,17 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum monetary value allowed in the field.", "defaultValue": "-Infinity" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "currencyCode", + "value": "\"auto\" | CurrencyCode", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -43123,7 +48233,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "string", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -43131,35 +48241,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -43167,14 +48277,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -43182,7 +48292,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -43206,7 +48316,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -43230,7 +48340,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -43238,23 +48348,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -43292,7 +48409,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -43300,17 +48417,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class MoneyField\n extends PreactFieldElement\n implements MoneyFieldProps\n{\n accessor max: MoneyFieldProps['max'];\n accessor min: MoneyFieldProps['min'];\n /**\n * The current monetary value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string representing the amount in the store's currency.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class MoneyField extends MoneyFieldBase implements MoneyFieldProps {\n constructor();\n}" + }, + "CurrencyCode": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CurrencyCode", + "value": "'USD' | 'EUR' | 'GBP' | 'CAD' | 'AFN' | 'ALL' | 'DZD' | 'AOA' | 'ARS' | 'AMD' | 'AWG' | 'AUD' | 'BBD' | 'AZN' | 'BDT' | 'BSD' | 'BHD' | 'BIF' | 'BZD' | 'BMD' | 'BTN' | 'BAM' | 'BRL' | 'BOB' | 'BWP' | 'BND' | 'BGN' | 'MMK' | 'KHR' | 'CVE' | 'KYD' | 'XAF' | 'CLP' | 'CNY' | 'COP' | 'KMF' | 'CDF' | 'CRC' | 'HRK' | 'CZK' | 'DKK' | 'DOP' | 'XCD' | 'EGP' | 'ETB' | 'XPF' | 'FJD' | 'GMD' | 'GHS' | 'GTQ' | 'GYD' | 'GEL' | 'HTG' | 'HNL' | 'HKD' | 'HUF' | 'ISK' | 'INR' | 'IDR' | 'ILS' | 'IQD' | 'JMD' | 'JPY' | 'JEP' | 'JOD' | 'KZT' | 'KES' | 'KWD' | 'KGS' | 'LAK' | 'LVL' | 'LBP' | 'LSL' | 'LRD' | 'LTL' | 'MGA' | 'MKD' | 'MOP' | 'MWK' | 'MVR' | 'MXN' | 'MYR' | 'MUR' | 'MDL' | 'MAD' | 'MNT' | 'MZN' | 'NAD' | 'NPR' | 'ANG' | 'NZD' | 'NIO' | 'NGN' | 'NOK' | 'OMR' | 'PAB' | 'PKR' | 'PGK' | 'PYG' | 'PEN' | 'PHP' | 'PLN' | 'QAR' | 'RON' | 'RUB' | 'RWF' | 'WST' | 'SAR' | 'RSD' | 'SCR' | 'SGD' | 'SDG' | 'SYP' | 'ZAR' | 'KRW' | 'SSP' | 'SBD' | 'LKR' | 'SRD' | 'SZL' | 'SEK' | 'CHF' | 'TWD' | 'THB' | 'TZS' | 'TTD' | 'TND' | 'TRY' | 'TMT' | 'UGX' | 'UAH' | 'AED' | 'UYU' | 'UZS' | 'VUV' | 'VND' | 'XOF' | 'YER' | 'ZMW' | 'BYN' | 'BYR' | 'DJF' | 'ERN' | 'FKP' | 'GIP' | 'GNF' | 'IRR' | 'KID' | 'LYD' | 'MRU' | 'SLL' | 'SHP' | 'SOS' | 'STD' | 'STN' | 'TJS' | 'TOP' | 'VED' | 'VEF' | 'VES' | 'XXX'", + "description": "" }, "NumberField": { "filePath": "src/surfaces/admin/components.ts", "name": "NumberField", - "description": "Configure the following properties on the number field component.", - "isPublicDocs": true, + "description": "The number field custom element class that renders a numeric input field in the Shopify admin interface. This component allows merchants to enter numbers with automatic validation and prefix/suffix display.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -43324,7 +48462,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inputMode", "value": "\"decimal\" | \"numeric\"", - "description": "The type of virtual keyboard to display on mobile devices.\n\n- `decimal`: Shows a numeric keyboard with a decimal point, suitable for prices or measurements.\n- `numeric`: Shows a numeric keyboard without a decimal point, suitable for whole numbers like quantities.\n\nLearn more about the [inputmode attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode).", + "description": "The input mode hint for mobile keyboards. Available values include:\n- `numeric`: Shows a numeric keypad optimized for entering numbers\n- `decimal`: Shows a numeric keypad with decimal point support\n- `tel`: Shows a telephone keypad", "defaultValue": "'decimal'" }, { @@ -43332,7 +48470,7 @@ "syntaxKind": "PropertyDeclaration", "name": "step", "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "description": "The granularity that the value must adhere to, or the keyword `any`. This controls the increment/decrement step size.", "defaultValue": "1" }, { @@ -43340,7 +48478,7 @@ "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum numeric value allowed in the field.", "defaultValue": "Infinity" }, { @@ -43348,7 +48486,7 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum numeric value allowed in the field.", "defaultValue": "-Infinity" }, { @@ -43356,7 +48494,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the user's input, such as a currency symbol.", "defaultValue": "''" }, { @@ -43364,7 +48502,7 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the user's input, such as a unit of measurement.", "defaultValue": "''" }, { @@ -43372,7 +48510,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | NumberAutocompleteField | `section-${string} one-time-code` | `section-${string} cc-number` | `section-${string} cc-csc` | \"shipping one-time-code\" | \"shipping cc-number\" | \"shipping cc-csc\" | \"billing one-time-code\" | \"billing cc-number\" | \"billing cc-csc\" | `section-${string} shipping one-time-code` | `section-${string} shipping cc-number` | `section-${string} shipping cc-csc` | `section-${string} billing one-time-code` | `section-${string} billing cc-number` | `section-${string} billing cc-csc`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -43380,35 +48518,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -43416,14 +48554,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -43431,7 +48569,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -43455,7 +48593,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -43479,7 +48617,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -43487,23 +48625,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -43541,7 +48686,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -43549,32 +48694,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class NumberField\n extends PreactFieldElement\n implements NumberFieldProps\n{\n /**\n * The current numeric value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string (decimal or integer).\n */\n get value(): string;\n set value(value: string);\n accessor inputMode: NumberFieldProps['inputMode'];\n accessor step: NumberFieldProps['step'];\n accessor max: NumberFieldProps['max'];\n accessor min: NumberFieldProps['min'];\n accessor prefix: NumberFieldProps['prefix'];\n accessor suffix: NumberFieldProps['suffix'];\n constructor();\n}" + "value": "declare class NumberField extends NumberFieldBase implements NumberFieldProps {\n constructor();\n}" }, "NumberAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "NumberAutocompleteField", "value": "'one-time-code' | 'cc-number' | 'cc-csc'", - "description": "Represents autocomplete values that are valid for number input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for numeric inputs.\n\nAvailable values:\n- `one-time-code` - One-time codes for authentication (OTP, 2FA codes)\n- `cc-number` - Credit card number\n- `cc-csc` - Credit card security code (CVV/CVC)", - "isPublicDocs": true + "description": "" }, "Option": { "filePath": "src/surfaces/admin/components.ts", "name": "Option", - "description": "Represents a single option within a select component. Use only as a child of s-select components.", - "isPublicDocs": true, + "description": "A single option within a select dropdown that users can choose.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the option is currently selected.", "defaultValue": "false" }, { @@ -43582,7 +48740,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the option should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -43590,16 +48748,23 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this option is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the option is disabled and can't be selected.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -43645,7 +48810,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -43653,24 +48818,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Option extends PreactCustomElement implements OptionProps {\n accessor selected: OptionProps['selected'];\n accessor defaultSelected: OptionProps['defaultSelected'];\n accessor value: OptionProps['value'];\n accessor disabled: OptionProps['disabled'];\n constructor();\n}" + "value": "declare class Option extends PolarisCustomElement implements OptionProps {\n /**\n * Whether the option is currently selected.\n */\n selected: OptionProps['selected'];\n /**\n * Whether the option should be selected when it's first rendered.\n */\n defaultSelected: OptionProps['defaultSelected'];\n /**\n * The value that's submitted with the form when this option is selected.\n */\n value: OptionProps['value'];\n /**\n * Whether the option is disabled and can't be selected.\n */\n disabled: OptionProps['disabled'];\n constructor();\n}" }, "OptionGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionGroup", - "description": "Represents a group of options within a select component. Use only as a child of `s-select` components.", - "isPublicDocs": true, + "description": "A group of related options within a select dropdown, displayed with a label.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the options within this group can be selected or not.", + "description": "Whether all options in the group are disabled and can't be selected.", "defaultValue": "false" }, { @@ -43678,7 +48857,14 @@ "syntaxKind": "PropertyDeclaration", "name": "label", "value": "string", - "description": "The user-facing label for this group of options." + "description": "The text that describes what this group of options represents." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -43725,7 +48911,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -43733,18 +48919,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OptionGroup\n extends PreactCustomElement\n implements OptionGroupProps\n{\n accessor disabled: OptionGroupProps['disabled'];\n accessor label: OptionGroupProps['label'];\n constructor();\n}" + "value": "declare class OptionGroup\n extends PolarisCustomElement\n implements OptionGroupProps\n{\n /**\n * Whether all options in the group are disabled and can't be selected.\n */\n disabled: OptionGroupProps['disabled'];\n /**\n * The text that describes what this group of options represents.\n */\n label: OptionGroupProps['label'];\n constructor();\n}" }, "OrderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "OrderedList", - "description": "Configure the following properties on the ordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a numbered list of items with automatic numbering and proper list semantics. Use ordered list when the sequence or order of items matters, such as instructions, rankings, or step-by-step processes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -43790,7 +48997,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -43798,48 +49005,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OrderedList\n extends PreactCustomElement\n implements OrderedListProps\n{\n constructor();\n}" + "value": "declare class OrderedList\n extends PolarisCustomElement\n implements OrderedListProps\n{\n constructor();\n}" }, "Paragraph": { "filePath": "src/surfaces/admin/components.ts", "name": "Paragraph", - "description": "Configure the following properties on the paragraph component.", - "isPublicDocs": true, + "description": "A custom element for displaying blocks of text content with consistent spacing and styling for readable body copy. Use Paragraph to render longer text content with proper line height and spacing between paragraphs.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "lineClamp", - "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", - "defaultValue": "Infinity - no truncation is applied" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the paragraph text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"caution\"", - "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "lineClamp", + "value": "number", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", + "defaultValue": "Infinity - no truncation is applied" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color of the paragraph text.", "defaultValue": "'base'" }, { @@ -43847,7 +49068,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -43855,9 +49076,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -43903,7 +49131,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -43911,24 +49139,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Paragraph extends PreactCustomElement implements ParagraphProps {\n accessor fontVariantNumeric: ParagraphProps['fontVariantNumeric'];\n accessor lineClamp: ParagraphProps['lineClamp'];\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: ParagraphProps['tone'];\n\n accessor color: ParagraphProps['color'];\n accessor dir: ParagraphProps['dir'];\n accessor accessibilityVisibility: ParagraphProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Paragraph extends ParagraphBase implements ParagraphProps {\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: ParagraphProps['tone'];\n constructor();\n}" }, "PasswordField": { "filePath": "src/surfaces/admin/components.ts", "name": "PasswordField", - "description": "Configure the following properties on the password field component.", - "isPublicDocs": true, + "description": "The password field custom element class that renders a password input field in the Shopify admin interface. This component allows merchants to enter passwords securely with characters automatically masked for privacy.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the password.", "defaultValue": "Infinity" }, { @@ -43936,22 +49178,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the password.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | PasswordAutocompleteField | `section-${string} current-password` | `section-${string} new-password` | \"shipping current-password\" | \"shipping new-password\" | \"billing current-password\" | \"billing new-password\" | `section-${string} shipping current-password` | `section-${string} shipping new-password` | `section-${string} billing current-password` | `section-${string} billing new-password`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -43959,35 +49194,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -43995,14 +49230,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -44010,7 +49245,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -44034,7 +49269,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -44058,7 +49293,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -44066,23 +49301,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -44120,7 +49369,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -44128,34 +49377,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class PasswordField\n extends PreactFieldElement\n implements PasswordFieldProps\n{\n accessor maxLength: PasswordFieldProps['maxLength'];\n accessor minLength: PasswordFieldProps['minLength'];\n /**\n * The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class PasswordField\n extends PasswordFieldBase\n implements PasswordFieldProps\n{\n constructor();\n}" }, "PasswordAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PasswordAutocompleteField", "value": "'current-password' | 'new-password'", - "description": "Represents autocomplete values that are valid for password input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for password inputs.\n\nAvailable values:\n- `current-password` - Existing password for login or authentication\n- `new-password` - New password when creating an account or changing password", - "isPublicDocs": true + "description": "" }, "QueryContainer": { "filePath": "src/surfaces/admin/components.ts", "name": "QueryContainer", - "description": "Configure the following properties on the query container component.", - "isPublicDocs": true, + "description": "A component that sets up a container query context, which lets child elements style themselves based on the container's size instead of the viewport size.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "containerName", "value": "string", - "description": "An identifier for this container that you can reference in CSS container queries to apply styles based on this specific container's size.\n\nAll query container components automatically receive a container name of `s-default`. You can omit the container name in your queries, so `@container (inline-size <= 300px)` is equivalent to `@container s-default (inline-size <= 300px)`.\n\nWhen you provide a custom `containerName`, it's added alongside `s-default`. For example, `containerName=\"product-card\"` results in `s-default product-card` being set on the `container-name` CSS property, allowing you to target this container with `@container product-card (inline-size <= 300px)`.\n\nLearn more about the [container-name property](https://developer.mozilla.org/en-US/docs/Web/CSS/container-name).", + "description": "The name of the container, which you can reference in CSS container queries.", "defaultValue": "''" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -44201,7 +49470,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -44209,24 +49478,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class QueryContainer\n extends PreactCustomElement\n implements QueryContainerProps\n{\n accessor containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" + "value": "declare class QueryContainer\n extends PolarisCustomElement\n implements QueryContainerProps\n{\n /**\n * The name of the container, which you can reference in CSS container queries.\n */\n containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" }, "SearchField": { "filePath": "src/surfaces/admin/components.ts", "name": "SearchField", - "description": "Configure the following properties on the search field component.", - "isPublicDocs": true, + "description": "A search field that lets users enter search queries with a search-specific input type.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters that can be entered in the field.", "defaultValue": "Infinity" }, { @@ -44234,22 +49517,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters that must be entered for the field to be valid.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -44257,35 +49533,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -44293,14 +49569,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -44308,7 +49584,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -44332,7 +49608,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -44356,7 +49632,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -44364,23 +49640,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -44418,7 +49708,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -44426,25 +49716,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class SearchField\n extends PreactFieldElement\n implements SearchFieldProps\n{\n accessor maxLength: SearchFieldProps['maxLength'];\n accessor minLength: SearchFieldProps['minLength'];\n /**\n * The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class SearchField extends SearchFieldBase implements SearchFieldProps {\n constructor();\n}" }, "TextAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" }, "Section": { "filePath": "src/surfaces/admin/components.ts", "name": "Section", - "description": "Configure the following properties on the section component.", - "isPublicDocs": true, + "description": "A section is a container that groups related content together with an optional heading.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -44454,28 +49757,43 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "The accessibility label for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The heading text displayed at the top of the section. This heading provides a title for the section's content and automatically uses the appropriate semantic heading level (h2, h3, h4) based on nesting depth to maintain proper document structure." + "description": "The heading text for the section." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "\"base\" | \"none\"", - "description": "The padding applied to all edges of the element.\n\n- `base`: applies padding that is appropriate for the element. Note that it might result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the section need to span to the edge of the section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "description": "Whether the section has padding.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -44492,14 +49810,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -44513,7 +49823,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -44521,59 +49831,73 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Section extends PreactCustomElement implements SectionProps {\n constructor();\n /** @private */\n connectedCallback(): void;\n accessor accessibilityLabel: SectionProps['accessibilityLabel'];\n accessor heading: SectionProps['heading'];\n accessor padding: SectionProps['padding'];\n}" + "value": "declare class Section extends SectionBase implements SectionProps {\n constructor();\n}" }, "Select": { "filePath": "src/surfaces/admin/components.ts", "name": "Select", - "description": "Configure the following properties on the select component.", - "isPublicDocs": true, + "description": "A select dropdown that lets users choose one option from a list.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier." + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the select." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the select when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the select is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "Text that appears in the select when no option is selected to provide a hint about what to choose." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether an option must be selected before the form can be submitted.", "defaultValue": "false" }, { @@ -44581,7 +49905,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -44605,7 +49929,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component." + "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected Option component." }, { "filePath": "src/surfaces/admin/components.ts", @@ -44618,15 +49942,15 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@usedFirstOptionSymbol@12029", + "name": "__@usedFirstOptionSymbol@17470", "value": "boolean", - "description": "A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n\nThis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.", + "description": "used to determine if no value or defaultValue was set, in which case the first non-disabled option was used\n\nthis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@hasInitialValueSymbol@12030", + "name": "__@hasInitialValueSymbol@17471", "value": "boolean", "description": "", "isPrivate": true @@ -44636,7 +49960,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -44644,23 +49968,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -44690,7 +50021,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -44698,33 +50029,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Select extends PreactInputElement implements SelectProps {\n accessor icon: SelectProps['icon'];\n accessor details: SelectProps['details'];\n accessor error: SelectProps['error'];\n accessor label: SelectProps['label'];\n accessor placeholder: SelectProps['placeholder'];\n accessor required: SelectProps['required'];\n accessor labelAccessibilityVisibility: SelectProps['labelAccessibilityVisibility'];\n /** @private */\n connectedCallback(): void;\n /**\n * A lifecycle callback that fires when the component is removed from the DOM. Performs cleanup operations.\n * @private\n */\n disconnectedCallback(): void;\n constructor();\n /**\n * A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n *\n * This is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.\n * @private\n */\n [usedFirstOptionSymbol]: boolean;\n /**\n * @private\n */\n [hasInitialValueSymbol]: boolean;\n /**\n * The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component.\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n}" + "value": "declare class Select extends SelectBase implements SelectProps {\n constructor();\n}" }, "Spinner": { "filePath": "src/surfaces/admin/components.ts", "name": "Spinner", - "description": "Configure the following properties on the spinner component.", - "isPublicDocs": true, + "description": "A component that displays an animated loading indicator to show that content is currently being processed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the spinner for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the loading spinner.\n\n- `base`: Default size suitable for inline loading indicators or standard UI contexts.\n- `large`: Larger spinner for more prominent loading states.\n- `large-100`: Extra large spinner for full-page or emphasized loading states.", + "description": "The size of the spinner.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -44770,7 +50122,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -44778,24 +50130,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Spinner extends PreactCustomElement implements SpinnerProps {\n accessor accessibilityLabel: string;\n accessor size: SpinnerProps['size'];\n constructor();\n}" + "value": "declare class Spinner extends PolarisCustomElement implements SpinnerProps {\n /**\n * A label that describes the spinner for assistive technologies.\n */\n accessibilityLabel: string;\n /**\n * The size of the spinner.\n */\n size: SpinnerProps['size'];\n constructor();\n}" }, "Stack": { "filePath": "src/surfaces/admin/components.ts", "name": "Stack", - "description": "Configure the following properties on the stack component.", - "isPublicDocs": true, + "description": "A stack is a layout component that arranges its children in a single direction with controlled spacing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "direction", "value": "MaybeResponsive<\"inline\" | \"block\">", - "description": "The direction in which the stack's children are placed within the stack.\n\nAccepts:\n- A single value, either `inline` or `block`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported direction values as a query value", + "description": "The direction in which the stack's children are arranged.", "defaultValue": "'block'" }, { @@ -44803,7 +50169,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "JustifyContentKeyword", - "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -44811,7 +50177,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "AlignItemsKeyword", - "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -44819,7 +50185,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "AlignContentKeyword", - "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.", "defaultValue": "'normal'" }, { @@ -44827,7 +50193,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between the stack's children.", "defaultValue": "'none'" }, { @@ -44835,7 +50201,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between rows in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -44843,7 +50209,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between columns in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -44851,7 +50217,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -44859,7 +50225,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -44867,7 +50233,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -44875,7 +50241,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -44883,7 +50249,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -44891,7 +50257,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -44899,7 +50265,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -44907,7 +50273,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -44915,7 +50281,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -44923,7 +50289,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -44931,7 +50297,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -44939,7 +50305,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -44947,7 +50313,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -44955,7 +50321,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -44963,7 +50329,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -44971,7 +50337,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -44979,7 +50345,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -44999,7 +50365,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -45007,7 +50373,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -45015,7 +50381,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -45023,7 +50389,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -45031,14 +50397,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -45046,9 +50412,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -45094,7 +50467,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -45102,32 +50475,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n accessor direction: StackProps['direction'];\n accessor justifyContent: StackProps['justifyContent'];\n accessor alignItems: StackProps['alignItems'];\n accessor alignContent: StackProps['alignContent'];\n accessor gap: StackProps['gap'];\n accessor rowGap: StackProps['rowGap'];\n accessor columnGap: StackProps['columnGap'];\n}" + "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n /**\n * The direction in which the stack's children are arranged.\n */\n direction: StackProps['direction'];\n /**\n * Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n */\n justifyContent: StackProps['justifyContent'];\n /**\n * Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n */\n alignItems: StackProps['alignItems'];\n /**\n * Controls the distribution of lines along the block axis when content wraps into multiple lines.\n */\n alignContent: StackProps['alignContent'];\n /**\n * The spacing between the stack's children.\n */\n gap: StackProps['gap'];\n /**\n * The spacing between rows in the stack.\n */\n rowGap: StackProps['rowGap'];\n /**\n * The spacing between columns in the stack.\n */\n columnGap: StackProps['columnGap'];\n}" }, "Switch": { "filePath": "src/surfaces/admin/components.ts", "name": "Switch", - "description": "Configure the following properties on the switch component.", - "isPublicDocs": true, + "description": "A switch that lets users toggle a setting on or off with a sliding control.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -45142,7 +50536,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -45150,28 +50544,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -45194,7 +50588,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -45202,23 +50596,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -45264,7 +50665,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -45272,24 +50673,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Switch extends PreactCheckboxElement implements SwitchProps {\n accessor labelAccessibilityVisibility: SwitchProps['labelAccessibilityVisibility'];\n constructor();\n}" + "value": "declare class Switch extends SwitchBase implements SwitchProps {\n constructor();\n}" }, "Table": { "filePath": "src/surfaces/admin/components.ts", "name": "Table", - "description": "Configure the following properties on the table component.", - "isPublicDocs": true, + "description": "A component that displays data in a structured table format that automatically adapts to the available space.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "variant", "value": "\"auto\" | \"list\"", - "description": "The layout variant of the table component.\n\n- `list`: Always displays as a list layout.\n- `table`: Always displays as a traditional table layout.\n- `auto`: Automatically displays as a table on wide screens and as a list on narrow screens.", + "description": "The display variant of the table.", "defaultValue": "'auto'" }, { @@ -45297,7 +50712,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table. When `true`, the table might be in an inert state that prevents user interaction.", + "description": "Whether the table is currently in a loading state.", "defaultValue": "false" }, { @@ -45305,7 +50720,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paginate", "value": "boolean", - "description": "Whether to use pagination controls.", + "description": "Whether the pagination controls are displayed.", "defaultValue": "false" }, { @@ -45313,7 +50728,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hasPreviousPage", "value": "boolean", - "description": "Whether there's a previous page of data.", + "description": "Whether there's a previous page of data that the user can navigate to.", "defaultValue": "false" }, { @@ -45321,25 +50736,40 @@ "syntaxKind": "PropertyDeclaration", "name": "hasNextPage", "value": "boolean", - "description": "Whether there's an additional page of data.", + "description": "Whether there's a next page of data that the user can navigate to.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@actualTableVariantSymbol@12105", - "value": "AddedContext", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@actualTableVariantSymbol@17550", + "value": "_shopify_admin_web_component_foundations.AddedContext", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@tableHeadersSharedDataSymbol@12106", - "value": "AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", + "name": "__@tableHeadersSharedDataSymbol@17551", + "value": "_shopify_admin_web_component_foundations.AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -45385,7 +50815,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -45393,78 +50823,69 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Table extends PreactCustomElement implements TableProps {\n accessor variant: TableProps['variant'];\n accessor loading: TableProps['loading'];\n accessor paginate: TableProps['paginate'];\n accessor hasPreviousPage: TableProps['hasPreviousPage'];\n accessor hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" - }, - "AddedContext": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AddedContext", - "description": "", - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "T", - "description": "The current context value.\n\nThe new context value to set, which will notify all consumers." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "addEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", - "description": "The **`addEventListener()`** method of the EventTarget interface sets up a function that will be called whenever the specified event is delivered to the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener)" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "dispatchEvent", - "value": "(event: Event) => boolean", - "description": "The **`dispatchEvent()`** method of the EventTarget sends an Event to the object, (synchronously) invoking the affected event listeners in the appropriate order.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/dispatchEvent)" + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "removeEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", - "description": "The **`removeEventListener()`** method of the EventTarget interface removes an event listener previously registered with EventTarget.addEventListener() from the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/removeEventListener)" + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AddedContext extends EventTarget {\n constructor(defaultValue: T);\n /**\n * The current context value.\n */\n get value(): T;\n /**\n * The new context value to set, which will notify all consumers.\n */\n set value(value: T);\n}" + "value": "declare class Table extends PolarisCustomElement implements TableProps {\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The display variant of the table.\n */\n variant: TableProps['variant'];\n /**\n * Whether the table is currently in a loading state.\n */\n loading: TableProps['loading'];\n /**\n * Whether the pagination controls are displayed.\n */\n paginate: TableProps['paginate'];\n /**\n * Whether there's a previous page of data that the user can navigate to.\n */\n hasPreviousPage: TableProps['hasPreviousPage'];\n /**\n * Whether there's a next page of data that the user can navigate to.\n */\n hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: _shopify_admin_web_component_foundations.AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: _shopify_admin_web_component_foundations.AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" }, "ActualTableVariant": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ActualTableVariant", "value": "'table' | 'list'", - "description": "Represents the actual rendered variant of a table component.\n- `table`: Displays as a traditional table layout.\n- `list`: Displays as a list layout.", - "isPublicDocs": true + "description": "" }, "ListSlotType": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ListSlotType", "value": "'primary' | 'secondary' | 'kicker' | 'inline' | 'labeled'", - "description": "Represents the semantic type of content slots within list items.\n\n- `primary`: The main content or title of the list item.\n- `secondary`: Supporting or descriptive content below the primary content.\n- `kicker`: A small label or tag displayed above the primary content.\n- `inline`: Content displayed inline with the primary content.\n- `labeled`: Content with an associated label.", - "isPublicDocs": true + "description": "" }, "HeaderFormat": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true }, "TableBody": { "filePath": "src/surfaces/admin/components.ts", "name": "TableBody", - "description": "The table body component represents the main content area of a table, containing the data rows. Use table body as a child of table to structure your table data, with each table row within the body representing a single record or entry.\n\nTable body must contain table row components, which in turn contain table cell components for the actual data values.", - "isPublicDocs": true, + "description": "A component that wraps the body content of a table, which contains the data rows.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -45510,7 +50931,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -45518,26 +50939,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableBody extends PreactCustomElement implements TableBodyProps {\n constructor();\n}" + "value": "declare class TableBody extends PolarisCustomElement implements TableBodyProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n}" }, "TableCell": { "filePath": "src/surfaces/admin/components.ts", "name": "TableCell", - "description": "The table cell component represents a single data cell within a table row. Use table cell as a child of table row to display individual data values, with each cell corresponding to a column in the table.\n\nTable cell automatically inherits styling and alignment from its parent table structure and supports text content or other inline components.", - "isPublicDocs": true, + "description": "A component that represents a single cell in a table row, which displays data in a format that's determined by its column header.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", - "name": "__@headerFormatSymbol@12128", + "name": "__@headerFormatSymbol@17578", "value": "HeaderFormat", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -45583,7 +51033,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -45591,24 +51041,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableCell extends PreactCustomElement implements TableCellProps {\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" + "value": "declare class TableCell extends PolarisCustomElement implements TableCellProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" }, "TableHeader": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeader", - "description": "The table header component represents a single column header within a table header row. Use table header as a child of table header row to define column headings and optionally enable column sorting.\n\nTable header provides semantic meaning for screen readers and can include sorting controls when configured. Each header corresponds to a column in the table body.", - "isPublicDocs": true, + "description": "A component that defines a column header in a table, which specifies both the header label and how the column's data should be formatted.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "listSlot", "value": "ListSlotType", - "description": "The content designation for this column when the table displays in list variant on mobile devices.", + "description": "The slot where this header's data appears when the table is shown in list view.", "defaultValue": "'labeled'" }, { @@ -45616,7 +51080,22 @@ "syntaxKind": "PropertyDeclaration", "name": "format", "value": "HeaderFormat", - "description": "The format of the column that controls styling and alignment of cell content." + "description": "The format of the header and its corresponding cells." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -45663,7 +51142,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -45671,17 +51150,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeader\n extends PreactCustomElement\n implements TableHeaderProps\n{\n accessor listSlot: TableHeaderProps['listSlot'];\n accessor format: TableHeaderProps['format'];\n constructor();\n}" + "value": "declare class TableHeader\n extends PolarisCustomElement\n implements TableHeaderProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The slot where this header's data appears when the table is shown in list view.\n */\n listSlot: TableHeaderProps['listSlot'];\n /**\n * The format of the header and its corresponding cells.\n */\n format: TableHeaderProps['format'];\n constructor();\n}" }, "TableHeaderRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeaderRow", - "description": "The table header row component represents the header row of a table, containing column headings. Use table header row as the first child of table (before table body) to define the table structure and provide column labels.\n\nTable header row must contain table header components for each column. These headers provide context for the data columns and can support sorting functionality.", - "isPublicDocs": true, + "description": "A component that wraps the header row of a table, which contains the table header components that define the column structure.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -45699,6 +51192,21 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -45728,7 +51236,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -45736,24 +51244,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeaderRow\n extends PreactCustomElement\n implements TableHeaderRowProps\n{\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class TableHeaderRow\n extends PolarisCustomElement\n implements TableHeaderRowProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "TableRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableRow", - "description": "The table row component represents a single row of data within a table body. Use table row as a child of table body to structure individual records or entries in the table.\n\nTable row must contain table cell components, with each cell representing a data value for the corresponding column. The number of cells should match the number of headers in the table.", - "isPublicDocs": true, + "description": "A component that represents a single row in a table, which contains the data cells.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "clickDelegate", "value": "string", - "description": "The ID of an interactive element, such as `s-link`, in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally." + "description": "A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -45800,7 +51337,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -45808,41 +51345,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableRow extends PreactCustomElement implements TableRowProps {\n constructor();\n accessor clickDelegate: string;\n}" + "value": "declare class TableRow extends PolarisCustomElement implements TableRowProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /**\n * A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector.\n */\n clickDelegate: string;\n}" }, "Text": { "filePath": "src/surfaces/admin/components.ts", "name": "Text", - "description": "Configure the following properties on the text component.", - "isPublicDocs": true, + "description": "A custom element for displaying inline or small blocks of text with various visual styles and semantic meanings. Use Text to render short pieces of content with appropriate styling, emphasis, and color treatment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color of the text.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", @@ -45857,7 +51408,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -45865,7 +51416,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, { @@ -45873,7 +51424,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The ID of an element this text provides contextual information for." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -45920,7 +51478,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -45928,24 +51486,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Text extends PreactCustomElement implements TextProps {\n accessor fontVariantNumeric: TextProps['fontVariantNumeric'];\n accessor color: TextProps['color'];\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: TextProps['tone'];\n /**\n * The semantic type and styling treatment for the text content.\n *\n * - `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n * - `generic`: Standard text with no special semantic meaning or styling.\n * - `address`: Marks the text as contact information, such as a physical or email address.\n * - `redundant`: Indicates the text is redundant or duplicated information for screen reader context.\n */\n accessor type: TextProps['type'];\n accessor dir: TextProps['dir'];\n accessor accessibilityVisibility: TextProps['accessibilityVisibility'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Text extends TextBase implements TextProps {\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: TextProps['tone'];\n constructor();\n}" }, "TextArea": { "filePath": "src/surfaces/admin/components.ts", "name": "TextArea", - "description": "Configure the following properties on the text area component.", - "isPublicDocs": true, + "description": "The text area custom element class that renders a multi-line text input field in the Shopify admin interface. This component allows merchants to enter and edit longer text content with support for labels, validation, and length constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -45953,7 +51525,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, { @@ -45961,22 +51533,15 @@ "syntaxKind": "PropertyDeclaration", "name": "rows", "value": "number", - "description": "A number of visible text lines.", + "description": "The number of visible text lines for the field, controlling its initial height.", "defaultValue": "2" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -45984,35 +51549,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -46020,14 +51585,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -46035,7 +51600,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -46059,7 +51624,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -46083,7 +51648,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -46091,23 +51656,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -46145,7 +51724,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -46153,24 +51732,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextArea\n extends PreactFieldElement\n implements TextAreaProps\n{\n accessor maxLength: TextAreaProps['maxLength'];\n accessor minLength: TextAreaProps['minLength'];\n accessor rows: TextAreaProps['rows'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextArea extends TextAreaBase implements TextAreaProps {\n constructor();\n}" }, "TextField": { "filePath": "src/surfaces/admin/components.ts", "name": "TextField", - "description": "Configure the following properties on the text field component.", - "isPublicDocs": true, + "description": "The text field custom element class that renders a single-line text input field in the Shopify admin interface. This component allows merchants to enter and edit text with support for labels, validation, icons, and prefix/suffix content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\" | AnyString", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "value": "IconType | AnyString", + "description": "An icon to display at the start of the text field, providing visual context for the input. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", "defaultValue": "''" }, { @@ -46178,7 +51771,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the merchant can enter in the field. When this limit is reached, the field prevents further input.", "defaultValue": "Infinity" }, { @@ -46186,7 +51779,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation. The field will be considered invalid if the merchant enters fewer characters than this value.", "defaultValue": "0" }, { @@ -46194,7 +51787,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the merchant's input, such as a currency symbol (`$`) or protocol (`https://`).", "defaultValue": "''" }, { @@ -46202,22 +51795,15 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the merchant's input, such as a unit of measurement (`kg`, `%`) or domain (`.myshopify.com`).", "defaultValue": "''" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -46225,35 +51811,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -46261,14 +51847,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -46276,7 +51862,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -46300,7 +51886,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -46324,7 +51910,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -46332,23 +51918,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -46386,7 +51986,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -46394,41 +51994,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextField\n extends PreactFieldElement\n implements TextFieldProps\n{\n accessor icon: TextFieldProps['icon'];\n accessor maxLength: TextFieldProps['maxLength'];\n accessor minLength: TextFieldProps['minLength'];\n accessor prefix: TextFieldProps['prefix'];\n accessor suffix: TextFieldProps['suffix'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextField extends TextFieldBase implements TextFieldProps {\n constructor();\n}" }, "Thumbnail": { "filePath": "src/surfaces/admin/components.ts", "name": "Thumbnail", - "description": "Configure the following properties on the thumbnail component.", - "isPublicDocs": true, + "description": "A thumbnail displays a small preview image with configurable sizing.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display in the thumbnail." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the product thumbnail image.\n\n- `small-200`: Smallest thumbnail size, ideal for compact product lists or tables.\n- `small-100`: Very small thumbnail, suitable for dense layouts.\n- `small`: Small thumbnail for space-constrained contexts.\n- `base`: Default size that balances visibility and space efficiency.\n- `large`: Larger thumbnail for featured products or detailed views.\n- `large-100`: Extra large thumbnail for prominent product display.", + "description": "The size of the thumbnail.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -46474,7 +52095,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -46482,22 +52103,36 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Thumbnail extends PreactCustomElement implements ThumbnailProps {\n accessor src: ThumbnailProps['src'];\n accessor alt: ThumbnailProps['alt'];\n accessor size: ThumbnailProps['size'];\n constructor();\n}" + "value": "declare class Thumbnail extends PolarisCustomElement implements ThumbnailProps {\n /**\n * The URL of the image to display in the thumbnail.\n */\n src: ThumbnailProps['src'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ThumbnailProps['alt'];\n /**\n * The size of the thumbnail.\n */\n size: ThumbnailProps['size'];\n constructor();\n}" }, "Tooltip": { "filePath": "src/surfaces/admin/components.ts", "name": "Tooltip", - "description": "Configure the following properties on the tooltip component.", - "isPublicDocs": true, + "description": "A component that displays a small popup with explanatory text when the user hovers over or focuses on an element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -46505,7 +52140,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -46513,11 +52148,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -46563,7 +52205,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -46571,8 +52213,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Tooltip extends PreactOverlayElement implements TooltipProps {\n constructor();\n}" @@ -46580,9 +52237,15 @@ "UnorderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "UnorderedList", - "description": "Configure the following properties on the unordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a bulleted list of items where the order doesn't matter. Use unordered list when you have a collection of related items without a specific sequence, such as features, options, or bullet points.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -46628,7 +52291,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -46636,32 +52299,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class UnorderedList\n extends PreactCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" + "value": "declare class UnorderedList\n extends PolarisCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" }, "URLField": { "filePath": "src/surfaces/admin/components.ts", "name": "URLField", - "description": "Configure the following properties on the URL field component.", - "isPublicDocs": true, + "description": "The URL field custom element class that renders a URL input field in the Shopify admin interface. This component allows merchants to enter web addresses with automatic URL validation and appropriate mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | `section-${string} url` | `section-${string} photo` | `section-${string} impp` | `section-${string} home impp` | `section-${string} mobile impp` | `section-${string} fax impp` | `section-${string} pager impp` | \"shipping url\" | \"shipping photo\" | \"shipping impp\" | \"shipping home impp\" | \"shipping mobile impp\" | \"shipping fax impp\" | \"shipping pager impp\" | \"billing url\" | \"billing photo\" | \"billing impp\" | \"billing home impp\" | \"billing mobile impp\" | \"billing fax impp\" | \"billing pager impp\" | `section-${string} shipping url` | `section-${string} shipping photo` | `section-${string} shipping impp` | `section-${string} shipping home impp` | `section-${string} shipping mobile impp` | `section-${string} shipping fax impp` | `section-${string} shipping pager impp` | `section-${string} billing url` | `section-${string} billing photo` | `section-${string} billing impp` | `section-${string} billing home impp` | `section-${string} billing mobile impp` | `section-${string} billing fax impp` | `section-${string} billing pager impp` | URLAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint about the intended content of the field for browser autofill.", + "defaultValue": "'url'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the URL.", "defaultValue": "Infinity" }, { @@ -46669,50 +52346,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the URL.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -46720,14 +52390,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -46735,7 +52405,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -46759,7 +52429,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -46783,7 +52453,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -46791,23 +52461,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -46845,7 +52529,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -46853,41 +52537,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class URLField\n extends PreactFieldElement\n implements URLFieldProps\n{\n accessor autocomplete: URLFieldProps['autocomplete'];\n accessor maxLength: URLFieldProps['maxLength'];\n accessor minLength: URLFieldProps['minLength'];\n /**\n * The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class URLField extends URLFieldBase implements URLFieldProps {\n constructor();\n}" }, "URLAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "URLAutocompleteField", "value": "'url' | 'photo' | 'impp' | 'home impp' | 'mobile impp' | 'fax impp' | 'pager impp'", - "description": "Represents autocomplete values that are valid for URL input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for URL inputs.\n\nAvailable values:\n- `url` - General URL or web address\n- `photo` - URL to a photo or image\n- `impp` - Instant messaging protocol URL\n- `home impp` - Home instant messaging protocol URL\n- `mobile impp` - Mobile instant messaging protocol URL\n- `fax impp` - Fax instant messaging protocol URL\n- `pager impp` - Pager instant messaging protocol URL", - "isPublicDocs": true + "description": "" }, "AdminAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminAction", - "description": "Configure the following properties on the admin action component.", - "isPublicDocs": true, + "description": "The admin action custom element class that renders action controls in the Shopify admin interface. This component creates a standardized action area with a heading and slots for primary and secondary action buttons, used exclusively in admin action extensions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text to use as the Action modal's title. If not provided, the name of the extension will be used." + "description": "The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the action is in a loading state, such as during initial page load or when the action is being opened. When `true`, the action might be in an inert state that prevents user interaction.", + "description": "Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -46933,7 +52637,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -46941,11 +52645,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminAction\n extends PreactCustomElement\n implements AdminActionProps\n{\n /**\n * The text to use as the Action modal's title. If not provided, the name of the extension will be used.\n */\n heading: string;\n /**\n * Whether the action is in a loading state, such as during initial page load or when the action is being opened.\n * When `true`, the action might be in an inert state that prevents user interaction.\n */\n loading: boolean;\n constructor();\n}" + "value": "declare class AdminAction\n extends PolarisCustomElement\n implements AdminActionProps\n{\n /**\n * The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading.\n */\n heading: string;\n /**\n * Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.\n *\n * @default false\n */\n loading: boolean;\n constructor();\n}" }, "RunnableExtension": { "filePath": "src/extension.ts", @@ -47158,22 +52877,28 @@ "AdminBlock": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminBlock", - "description": "Configure the following properties on the admin block component.", - "isPublicDocs": true, + "description": "The admin block custom element class that renders a collapsible content block in the Shopify admin interface. This component organizes content into expandable sections with headings and provides a summary when collapsed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text displayed as the block's title in the header. If not provided, the extension name will be used." + "description": "The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "collapsedSummary", "value": "string", - "description": "The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated." + "description": "The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -47220,7 +52945,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -47228,18 +52953,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminBlock\n extends PreactCustomElement\n implements AdminBlockProps\n{\n /**\n * The text displayed as the block's title in the header. If not provided, the extension name will be used.\n */\n heading: string;\n /**\n * The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated.\n */\n collapsedSummary: string;\n constructor();\n}" + "value": "declare class AdminBlock\n extends PolarisCustomElement\n implements AdminBlockProps\n{\n /**\n * The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed.\n */\n heading: string;\n /**\n * The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed.\n */\n collapsedSummary: string;\n constructor();\n}" }, "Form": { "filePath": "src/surfaces/admin/components.ts", "name": "Form", - "description": "Configure the following properties on the form component.", - "isPublicDocs": true, + "description": "The form custom element class that renders a form container in the Shopify admin interface. This component manages form submission, validation, and reset behavior for collecting merchant input.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -47285,7 +53031,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -47293,11 +53039,114 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Form extends PolarisCustomElement implements FormProps {\n constructor();\n}" + }, + "IntentRenderApi": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderApi", + "description": "The `IntentRenderApi` object provides methods for extensions that render in response to an app intent. Access the intent data to determine what action the merchant requested and use `intents.response` to resolve the intent when complete.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "auth", + "value": "Auth", + "description": "Provides methods for authenticating calls to your app backend. Use the `idToken()` method to retrieve a signed JWT token that verifies the current user's identity for secure server-side operations." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "extension", + "value": "{ target: ExtensionTarget; }", + "description": "The identifier of the running extension target. Use this to determine which target your extension is rendering in and conditionally adjust functionality or UI based on the extension context." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "i18n", + "value": "I18n", + "description": "Utilities for translating content according to the current localization of the admin. Use these methods to provide translated strings that match the merchant's language preferences, ensuring your extension is accessible to a global audience." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "intents", + "value": "IntentRenderIntents", + "description": "Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "picker", + "value": "PickerApi", + "description": "Opens a custom selection dialog with your app-specific data. Use the [Picker API](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/picker-api) to define the picker's heading, items, headers, and selection behavior. Returns a Promise that resolves to a `Picker` object with a `selected` property for accessing the merchant's selection." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "query", + "value": "(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>", + "description": "Executes GraphQL queries against the [GraphQL Admin API](/docs/api/admin-graphql). Use this to fetch shop data, manage resources, or perform mutations. Queries are automatically authenticated with the current user's permissions. Optionally specify GraphQL variables and API version for your query." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "resourcePicker", + "value": "ResourcePickerApi", + "description": "Opens the [resource picker](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/resource-picker-api) modal for selecting products, variants, or collections. Returns the selected resources when the user confirms their selection, or undefined if they cancel." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "storage", + "value": "Storage", + "description": "Provides methods for persisting data in browser storage that is scoped to your extension. Use this to store user preferences, cache data, maintain state across sessions, or save temporary working data. Storage is persistent across page reloads and isolated per extension." } ], - "value": "declare class Form extends PreactCustomElement implements FormProps {\n constructor();\n}" + "value": "export interface IntentRenderApi\n extends StandardRenderingExtensionApi {\n /**\n * Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow.\n */\n intents: IntentRenderIntents;\n}" + }, + "IntentRenderIntents": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderIntents", + "description": "The intents API available to intent render extensions. Unlike other targets where `response` is optional, intent render extensions always run inside an intent workflow so `response` is guaranteed.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled." + } + ], + "value": "export interface IntentRenderIntents {\n /**\n * Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled.\n */\n response: IntentResponseApi;\n}" + }, + "FormExtensionComponents": { + "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "FormExtensionComponents", + "value": "StandardComponents | 'Form'", + "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." }, "StandardApi": { "filePath": "src/surfaces/admin/api/standard/standard.ts", @@ -47815,19 +53664,18 @@ "value": "FormExtensionComponents | 'FunctionSettings'", "description": "The components available for building function settings extensions. Includes all form components plus the function settings component required for function settings configuration." }, - "FormExtensionComponents": { - "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "FormExtensionComponents", - "value": "StandardComponents | 'Form'", - "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." - }, "FunctionSettings": { "filePath": "src/surfaces/admin/components.ts", "name": "FunctionSettings", - "description": "Configure the following properties on the function settings component.", - "isPublicDocs": true, + "description": "The function settings custom element class that renders a specialized form for configuring Shopify Function settings in the admin interface. This component manages function configuration submission, validation, and error handling.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -47873,7 +53721,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -47881,8 +53729,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class FunctionSettings\n extends PreactCustomElement\n implements FunctionSettingsProps\n{\n constructor();\n}" @@ -47969,15 +53832,21 @@ "AdminPrintAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminPrintAction", - "description": "Configure the following properties on the admin print action component.", - "isPublicDocs": true, + "description": "The admin print action custom element class that renders a print interface in the Shopify admin. This component enables merchants to print content from a specified source URL using the browser's print functionality.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The `src` URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs, and images are supported." + "description": "The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -48024,7 +53893,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -48032,11 +53901,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminPrintAction\n extends PreactCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The `src` URL of the preview and the document to print.\n * If not provided, the preview will show an empty state and the print button will be disabled.\n * HTML, PDFs, and images are supported.\n */\n src: string;\n constructor();\n}" + "value": "declare class AdminPrintAction\n extends PolarisCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action.\n */\n src: string;\n constructor();\n}" }, "ProductDetailsConfigurationApi": { "filePath": "src/surfaces/admin/api/product-configuration/product-details-configuration.ts", @@ -49285,6 +55169,13 @@ "value": "RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >", "description": "A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options." }, + { + "filePath": "src/surfaces/admin/extension-targets.ts", + "syntaxKind": "PropertySignature", + "name": "admin.app.intent.render", + "value": "RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >", + "description": "Renders an admin extension for handling app intents." + }, { "filePath": "src/surfaces/admin/extension-targets.ts", "syntaxKind": "PropertySignature", @@ -49812,7 +55703,7 @@ "description": "A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules." } ], - "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n}" + "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n\n /**\n * Renders an admin extension for handling app intents.\n */\n 'admin.app.intent.render': RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >;\n}" }, "RenderExtension": { "filePath": "src/extension.ts", @@ -49986,9 +55877,17 @@ "value": "string | URL", "description": "The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.", + "isOptional": true } ], - "value": "export interface Intents {\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" + "value": "export interface Intents {\n /**\n * Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.\n */\n response?: IntentResponseApi;\n\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" }, "IntentInvokeApi": { "filePath": "src/surfaces/admin/api/intents/intents.ts", @@ -49998,6 +55897,67 @@ "members": [], "value": "export interface IntentInvokeApi {\n (query: IntentQuery): Promise;\n (intentURL: string, options?: IntentQueryOptions): Promise;\n}" }, + "IntentResponseApi": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "IntentResponseApi", + "description": "The `IntentResponseApi` object provides methods for resolving the current intent from within an invoked extension. This API is only present when your extension is running inside an intent workflow.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "closed", + "value": "() => Promise", + "description": "Resolves the current intent as closed without completing the workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "error", + "value": "(message: string, issues?: Issue[]) => Promise", + "description": "Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "ok", + "value": "(data?: { [key: string]: unknown; }) => Promise", + "description": "Resolves the current intent successfully. Pass output data when your intent defines a response schema." + } + ], + "value": "export interface IntentResponseApi {\n /**\n * Resolves the current intent successfully. Pass output data when your intent defines a response schema.\n */\n ok(data?: SuccessIntentResponse['data']): Promise;\n\n /**\n * Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available.\n */\n error(message: string, issues?: Issue[]): Promise;\n\n /**\n * Resolves the current intent as closed without completing the workflow.\n */\n closed(): Promise;\n}" + }, + "Issue": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "Issue", + "description": "A structured issue describing a validation or workflow error.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "code", + "value": "string", + "description": "A machine-readable error code for this issue. Use this for programmatic error handling or logging.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "message", + "value": "string", + "description": "A description of what's wrong with this field. Display this to help merchants understand how to fix the error.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "path", + "value": "string[]", + "description": "The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure.", + "isOptional": true + } + ], + "value": "export interface Issue {\n /** The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure. */\n path?: string[];\n /** A description of what's wrong with this field. Display this to help merchants understand how to fix the error. */\n message?: string;\n /** A machine-readable error code for this issue. Use this for programmatic error handling or logging. */\n code?: string;\n}" + }, "PickerApi": { "filePath": "src/surfaces/admin/api/picker/picker.ts", "name": "PickerApi", @@ -50491,29 +56451,28 @@ "Avatar": { "filePath": "src/surfaces/admin/components.ts", "name": "Avatar", - "description": "Configure the following properties on the avatar component.", - "isPublicDocs": true, + "description": "An avatar displays a user or entity image with fallback initials when the image isn't available.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "initials", "value": "string", - "description": "The initials to display in the avatar when no image is provided or fails to load. Typically one or two characters representing a person's first and last name initials, such as \"JD\" for John Doe." + "description": "The initials to display when no image is provided or if the image fails to load." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The URL or path to the avatar image. When provided, the image takes priority over `initials`. If the image fails to load or loads slowly, `initials` will be rendered as a fallback." + "description": "The URL of the avatar image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"base\" | \"large\" | \"large-200\"", - "description": "The size of the avatar image.\n\n- `small-200`: Extra small avatar, suitable for compact displays or lists with many items.\n- `small`: Small avatar, good for secondary contexts or tight layouts.\n- `base`: Default size that works well in most contexts.\n- `large`: Large avatar for emphasis or when the avatar is a focal point.\n- `large-200`: Extra large avatar for prominent display.", + "description": "The size of the avatar.", "defaultValue": "'base'" }, { @@ -50521,7 +56480,14 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the avatar for accessibility.\n\nProvides a text description of the avatar for users with assistive technology and serves as a fallback when the avatar fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an avatar, it reads this description aloud. When an avatar fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt)." + "description": "Alternative text that describes the avatar for screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -50568,7 +56534,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -50576,17 +56542,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Avatar extends PreactCustomElement implements AvatarProps {\n accessor initials: AvatarProps['initials'];\n accessor src: AvatarProps['src'];\n accessor size: AvatarProps['size'];\n accessor alt: AvatarProps['alt'];\n constructor();\n}" + "value": "declare class Avatar extends PolarisCustomElement implements AvatarProps {\n /**\n * The initials to display when no image is provided or if the image fails to load.\n */\n initials: AvatarProps['initials'];\n /**\n * The URL of the avatar image to display.\n */\n src: AvatarProps['src'];\n /**\n * The size of the avatar.\n */\n size: AvatarProps['size'];\n /**\n * Alternative text that describes the avatar for screen readers.\n */\n alt: AvatarProps['alt'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -50609,68 +56589,75 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred." + "description": "" } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" }, "Badge": { "filePath": "src/surfaces/admin/components.ts", "name": "Badge", - "description": "Configure the following properties on the badge component.", - "isPublicDocs": true, + "description": "The badge custom element class that renders status indicators in the Shopify admin interface. This component displays compact visual indicators with customizable tones, sizes, and optional icons to communicate status information to merchants.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"strong\"", - "description": "Controls the visual weight and emphasis of the badge.\n\n- `base`: Standard weight with moderate emphasis, suitable for most use cases.\n- `strong`: Increased visual weight for higher emphasis and prominence.", - "defaultValue": "'base'" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the badge to provide additional visual context or reinforce the badge's meaning. Accepts any icon name from the icon library or a custom string identifier." + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"strong\"", + "description": "The visual weight of the badge. Available options: `'base'` for standard weight or `'strong'` for increased emphasis.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the badge.\n\n- `base`: Default size suitable for most badge use cases.\n- `large`: Larger badge for increased visibility and prominence.\n- `large-100`: Extra large badge for maximum visibility in emphasized contexts.", + "description": "The size of the badge. Available options: `'base'` for standard size, `'large'` for larger size, or `'large-100'` for extra large size.", "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", - "defaultValue": "'auto'" + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -50717,7 +56704,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -50725,17 +56712,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Badge extends PreactCustomElement implements BadgeProps {\n accessor color: BadgeProps['color'];\n accessor icon: BadgeProps['icon'];\n accessor size: BadgeProps['size'];\n accessor tone: BadgeProps['tone'];\n constructor();\n}" + "value": "declare class Badge extends BadgeBase implements BadgeProps {\n /**\n * The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: BadgeProps['icon'];\n /**\n * The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.\n */\n tone: BadgeProps['tone'];\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "Banner": { "filePath": "src/surfaces/admin/components.ts", "name": "Banner", - "description": "Configure the following properties on the banner component.", - "isPublicDocs": true, + "description": "A custom element for displaying important messages and notifications.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -50750,7 +56758,7 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.", + "description": "The color tone of the banner based on its semantic meaning.", "defaultValue": "'auto'" }, { @@ -50758,7 +56766,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Controls whether the banner is visible or hidden.\n\nWhen using a controlled component pattern and the banner is `dismissible`, update this property to `true` when the `dismiss` event fires.\n\nYou can hide the banner programmatically by setting this to `true` even if it's not `dismissible`.", + "description": "Whether the banner is hidden from view.", "defaultValue": "false" }, { @@ -50766,9 +56774,16 @@ "syntaxKind": "PropertyDeclaration", "name": "dismissible", "value": "boolean", - "description": "Whether the banner displays a close button that allows users to dismiss it.\n\nWhen the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, any animation completes, and the `afterhide` event fires.", + "description": "Whether the banner can be dismissed by the user.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -50814,7 +56829,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -50822,24 +56837,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Banner extends PreactCustomElement implements BannerProps {\n accessor heading: BannerProps['heading'];\n accessor tone: BannerProps['tone'];\n accessor hidden: BannerProps['hidden'];\n accessor dismissible: BannerProps['dismissible'];\n constructor();\n}" + "value": "declare class Banner extends PolarisCustomElement implements BannerProps {\n /**\n * The heading text displayed at the top of the banner.\n */\n heading: BannerProps['heading'];\n /**\n * The color tone of the banner based on its semantic meaning.\n */\n tone: BannerProps['tone'];\n /**\n * Whether the banner is hidden from view.\n */\n hidden: BannerProps['hidden'];\n /**\n * Whether the banner can be dismissed by the user.\n */\n dismissible: BannerProps['dismissible'];\n constructor();\n}" }, "Box": { "filePath": "src/surfaces/admin/components.ts", "name": "Box", - "description": "Configure the following properties on the box component.", - "isPublicDocs": true, + "description": "A box is a container component that provides control over layout, spacing, and styling.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -50847,7 +56876,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -50855,7 +56884,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -50863,7 +56892,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -50871,7 +56900,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -50879,7 +56908,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -50887,7 +56916,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -50895,7 +56924,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -50903,7 +56932,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -50911,7 +56940,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -50919,7 +56948,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -50927,7 +56956,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -50935,7 +56964,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -50943,7 +56972,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -50951,7 +56980,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -50959,7 +56988,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -50967,7 +56996,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -50987,7 +57016,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -50995,7 +57024,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -51003,7 +57032,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -51011,7 +57040,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -51019,14 +57048,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -51034,9 +57063,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -51082,7 +57118,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -51090,8 +57126,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Box extends BoxElement implements BoxProps {\n constructor();\n}" @@ -51100,120 +57151,106 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -51221,60 +57258,60 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "Button": { "filePath": "src/surfaces/admin/components.ts", "name": "Button", - "description": "Configure the following properties on the button component.", - "isPublicDocs": true, + "description": "The button custom element class that renders interactive buttons in the Shopify admin interface. This component triggers actions or navigation when clicked, with customizable visual styles, states, and optional icons.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", - "defaultValue": "false" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier." + "name": "variant", + "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", + "description": "The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.", + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "loading", - "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", - "defaultValue": "false" + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "variant", - "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "defaultValue": "'auto'" + "name": "disabled", + "value": "boolean", + "description": "Whether the button is disabled, preventing any interaction. When `true`, the button appears visually disabled and doesn't respond to user clicks.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" + "name": "loading", + "value": "boolean", + "description": "Whether the button is in a loading state. When `true`, displays a loading indicator and prevents interaction to show that an action is in progress.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to open the linked document when the button acts as a link. Available options: `''`, `'_blank'`, `'_self'`, `'_parent'`, or `'_top'`.", "defaultValue": "'auto'" }, { @@ -51282,21 +57319,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "A URL that the button should navigate to when clicked. When provided, the button behaves as a link." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Prompts the user to save the linked URL as a file with the specified filename. Only works when `href` is provided." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The button's behavior in forms. Available options: `'button'`, `'submit'`, or `'reset'`.", "defaultValue": "'button'" }, { @@ -51304,7 +57341,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the button's purpose for screen readers. This is essential for accessibility when the button doesn't have visible text." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "inlineSize", + "value": "\"auto\" | \"fill\" | \"fit-content\"", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -51351,7 +57403,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -51359,15 +57411,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -51375,38 +57442,36 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Button extends Button_base implements ButtonProps {\n accessor disabled: ButtonProps['disabled'];\n accessor icon: ButtonProps['icon'];\n accessor loading: ButtonProps['loading'];\n accessor variant: ButtonProps['variant'];\n accessor tone: ButtonProps['tone'];\n accessor target: ButtonProps['target'];\n accessor href: ButtonProps['href'];\n accessor download: ButtonProps['download'];\n accessor type: ButtonProps['type'];\n accessor accessibilityLabel: ButtonProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Button\n extends ButtonBase\n implements ButtonProps\n{\n /**\n * The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: ButtonProps['icon'];\n /**\n * The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.\n */\n variant: ButtonProps['variant'];\n /**\n * The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.\n */\n tone: ButtonProps['tone'];\n constructor();\n}" }, "AnyString": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AnyString", "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true + "description": "Prevents widening string literal types in a union to `string`." }, "ButtonGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "ButtonGroup", - "description": "Configure the following properties on the button group component.", - "isPublicDocs": true, + "description": "A button group that arranges multiple buttons together with consistent spacing and semantic grouping for related actions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "\"base\" | \"none\"", - "description": "The spacing between buttons in the group.\n\n- `base`: Standard spacing that provides clear visual separation between buttons.\n- `none`: No spacing, creating a connected button group.", + "description": "The amount of spacing between buttons in the group, affecting the visual separation of actions.", "defaultValue": "'base'" }, { @@ -51414,7 +57479,21 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, describing the purpose of this group of buttons." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -51440,14 +57519,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -51461,7 +57532,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -51469,39 +57540,68 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ButtonGroup\n extends PreactCustomElement\n implements ButtonGroupProps\n{\n accessor gap: ButtonGroupProps['gap'];\n accessor accessibilityLabel: ButtonGroupProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class ButtonGroup extends ButtonGroupBase implements ButtonGroupProps {\n constructor();\n}" }, "Checkbox": { "filePath": "src/surfaces/admin/components.ts", "name": "Checkbox", - "description": "Configure the following properties on the checkbox component.", - "isPublicDocs": true, + "description": "A checkbox that lets users select or deselect an option, with support for an indeterminate state.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "indeterminate", "value": "boolean", - "description": "Whether the checkbox displays in an indeterminate state (neither checked nor unchecked), typically used to indicate partial selection in hierarchical lists.\n\nThis visual state takes priority over the `checked` prop in appearance only. The form submission value is still determined by the `checked` prop.\n\nIf `indeterminate` has not been explicitly set and hasn't been modified by user interaction, it returns the value of `defaultIndeterminate`." + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultIndeterminate", "value": "boolean", - "description": "The initial indeterminate state for uncontrolled components. Use this when you want the checkbox to start in an indeterminate state but don't need to control it afterward.\n\nThis value applies until `indeterminate` is explicitly set or the user changes the checkbox state by clicking.", + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "labelAccessibilityVisibility", + "value": "\"visible\" | \"exclusive\"", + "description": "", + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -51516,7 +57616,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -51524,28 +57624,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -51568,7 +57668,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -51576,23 +57676,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -51638,7 +57745,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -51646,24 +57753,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Checkbox extends PreactCheckboxElement implements CheckboxProps {\n get indeterminate(): CheckboxProps['indeterminate'];\n set indeterminate(indeterminate: CheckboxProps['indeterminate']);\n accessor defaultIndeterminate: CheckboxProps['defaultIndeterminate'];\n constructor();\n}" + "value": "declare class Checkbox extends CheckboxBase implements CheckboxProps {\n constructor();\n}" + }, + "CallbackEvent": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CallbackEvent", + "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." }, "Chip": { "filePath": "src/surfaces/admin/components.ts", "name": "Chip", - "description": "Configure the following properties on the chip component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "Modify the color to be more or less intense.", "defaultValue": "'base'" }, { @@ -51671,7 +57799,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -51718,7 +57861,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -51726,24 +57869,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Chip extends PreactCustomElement implements ChipProps {\n accessor color: ChipProps['color'];\n accessor accessibilityLabel: ChipProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Chip extends PolarisCustomElement implements ChipProps {\n color: ChipProps['color'];\n accessibilityLabel: ChipProps['accessibilityLabel'];\n removable: ChipProps['removable'];\n constructor(renderImpl?: Omit);\n}" }, "Choice": { "filePath": "src/surfaces/admin/components.ts", "name": "Choice", - "description": "The choice component creates individual selectable options within a choice list. Use choice to define each option that merchants can select, supporting both single selection (radio buttons) and multiple selection (checkboxes) modes.\n\nChoice components support labels, help text, and custom content through slots, providing flexible option presentation within choice lists.", - "isPublicDocs": true, + "description": "A single choice within a choice list that can be selected with a radio button or checkbox.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the choice is disabled and can't be selected.", "defaultValue": "false" }, { @@ -51751,7 +57908,7 @@ "syntaxKind": "GetAccessor", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the choice is currently selected.", "defaultValue": "false" }, { @@ -51759,21 +57916,21 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this choice is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, used when the visual label isn't descriptive enough." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the choice should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -51792,6 +57949,13 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -51821,7 +57985,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -51829,24 +57993,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Choice extends PreactCustomElement implements ChoiceProps {\n accessor disabled: ChoiceProps['disabled'];\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n accessor value: ChoiceProps['value'];\n accessor accessibilityLabel: ChoiceProps['accessibilityLabel'];\n accessor defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Choice extends PolarisCustomElement implements ChoiceProps {\n /**\n * Whether the choice is disabled and can't be selected.\n */\n disabled: ChoiceProps['disabled'];\n /**\n * Whether the choice is currently selected.\n */\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n /**\n * The value that's submitted with the form when this choice is selected.\n */\n value: ChoiceProps['value'];\n /**\n * A label that's only visible to screen readers, used when the visual label isn't descriptive enough.\n */\n accessibilityLabel: ChoiceProps['accessibilityLabel'];\n /**\n * Whether the choice should be selected when it's first rendered.\n */\n defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ChoiceList": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceList", - "description": "Configure the following properties on the choice list component.", - "isPublicDocs": true, + "description": "A list of choices that lets users select one or more options using radio buttons or checkboxes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "addEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", + "description": "Wraps change and input event listeners so they only fire when the event was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n\nThis prevents form events from elements inside secondary content (e.g. TextField, native ) from being mistakenly treated as ChoiceList value-change events, while still allowing those events to bubble normally through the DOM (preserving React's event delegation).", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "removeEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction. When `true`, the `disabled` property on any child choices is ignored.", + "description": "Whether all choices in the list are disabled and can't be selected.", "defaultValue": "false" }, { @@ -51854,43 +58048,43 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name that identifies this choice list when the form is submitted." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the choice list when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the choice list." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "multiple", "value": "boolean", - "description": "Whether multiple choices can be selected.", + "description": "Whether users can select more than one choice at a time.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the choice list is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -51898,7 +58092,7 @@ "syntaxKind": "GetAccessor", "name": "values", "value": "string[]", - "description": "An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected." + "description": "The values of the currently selected choices." }, { "filePath": "src/surfaces/admin/components.ts", @@ -51927,11 +58121,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$3@11434", + "name": "__@internals$3@16769", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -51961,7 +58162,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -51969,38 +58170,52 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ChoiceList extends BaseClass$3 implements ChoiceListProps {\n accessor disabled: ChoiceListProps['disabled'];\n accessor name: ChoiceListProps['name'];\n accessor error: ChoiceListProps['error'];\n accessor details: ChoiceListProps['details'];\n accessor multiple: ChoiceListProps['multiple'];\n accessor label: ChoiceListProps['label'];\n accessor labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class ChoiceList extends BaseClass$1 implements ChoiceListProps {\n /**\n * Wraps change and input event listeners so they only fire when the event\n * was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n *\n * This prevents form events from elements inside secondary content (e.g.\n * TextField, native ) from being mistakenly treated as ChoiceList\n * value-change events, while still allowing those events to bubble normally\n * through the DOM (preserving React's event delegation).\n * @private\n */\n addEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n\n /** @private */\n removeEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: EventListenerOptions | boolean,\n ): void;\n\n /**\n * Whether all choices in the list are disabled and can't be selected.\n */\n disabled: ChoiceListProps['disabled'];\n /**\n * The name that identifies this choice list when the form is submitted.\n */\n name: ChoiceListProps['name'];\n /**\n * An error message that's displayed below the choice list when validation fails.\n */\n error: ChoiceListProps['error'];\n /**\n * Additional text to provide context or guidance for the choice list.\n */\n details: ChoiceListProps['details'];\n /**\n * Whether users can select more than one choice at a time.\n */\n multiple: ChoiceListProps['multiple'];\n /**\n * The text that describes what the choice list is for.\n */\n label: ChoiceListProps['label'];\n /**\n * Controls whether the label is visible to all users or only to screen readers.\n */\n labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n /**\n * The values of the currently selected choices.\n */\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "Clickable": { "filePath": "src/surfaces/admin/components.ts", "name": "Clickable", - "description": "Configure the following properties on the clickable component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the component is disabled, preventing clicks and focus. When disabled, the `click` event won't fire and click events from child elements stop propagating immediately. Interactive child elements can still receive focus and be interacted with. This doesn't apply visual styling by default. You shouldapply disabled styling as needed." + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the component is in a loading state, which indicates to assistive technology that an action is in progress and prevents interaction." + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -52008,21 +58223,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "defaultValue": "'button'" }, { @@ -52030,7 +58245,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -52038,7 +58253,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -52046,7 +58261,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -52054,7 +58269,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -52062,7 +58277,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -52070,7 +58285,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -52078,7 +58293,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -52086,7 +58301,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -52094,7 +58309,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -52102,7 +58317,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -52110,7 +58325,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -52118,7 +58333,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -52126,7 +58341,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -52134,7 +58349,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -52142,7 +58357,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -52150,7 +58365,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -52158,7 +58373,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -52178,7 +58393,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -52186,7 +58401,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -52194,7 +58409,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -52202,7 +58417,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -52210,14 +58425,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -52225,9 +58440,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -52273,7 +58495,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -52281,15 +58503,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -52297,30 +58534,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n accessor disabled: ClickableProps['disabled'];\n accessor loading: ClickableProps['loading'];\n accessor target: ClickableProps['target'];\n accessor href: ClickableProps['href'];\n accessor download: ClickableProps['download'];\n accessor type: ClickableProps['type'];\n constructor();\n}" + "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n disabled: ClickableProps['disabled'];\n loading: ClickableProps['loading'];\n target: ClickableProps['target'];\n href: ClickableProps['href'];\n download: ClickableProps['download'];\n type: ClickableProps['type'];\n constructor();\n}" }, "ClickableChip": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChip", - "description": "Configure the following properties on the clickable chip component.", - "isPublicDocs": true, + "description": "A custom element for displaying interactive chips that can be clicked or removed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "The color of the chip.", "defaultValue": "'base'" }, { @@ -52328,14 +58564,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the chip for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "removable", "value": "boolean", - "description": "Whether the chip displays a remove button for dismissal. When clicked, the `remove` callback fires.", + "description": "Whether the chip can be removed by the user.", "defaultValue": "false" }, { @@ -52343,7 +58579,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Whether the chip is hidden from view. When using controlled component pattern with `removable` chips, update this property when the `remove` event fires. For non-removable chips, manually toggle this property to show or hide the chip.", + "description": "Whether the chip is hidden from view.", "defaultValue": "false" }, { @@ -52351,7 +58587,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the chip is disabled, preventing any user interaction.", + "description": "Whether the chip is disabled and can't be clicked.", "defaultValue": "false" }, { @@ -52359,7 +58595,14 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to navigate to when the chip is clicked." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -52406,7 +58649,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -52414,15 +58657,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -52430,30 +58688,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class ClickableChip\n extends ClickableChip_base\n implements ClickableChipProps\n{\n accessor color: ClickableChipProps['color'];\n accessor accessibilityLabel: ClickableChipProps['accessibilityLabel'];\n accessor removable: ClickableChipProps['removable'];\n accessor hidden: ClickableChipProps['hidden'];\n accessor disabled: ClickableChipProps['disabled'];\n accessor href: ClickableChipProps['href'];\n constructor();\n}" + "value": "declare class ClickableChip\n extends ClickableChipBase\n implements ClickableChipProps\n{\n /**\n * The color of the chip.\n */\n color: ClickableChipProps['color'];\n constructor();\n}" }, "ColorField": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorField", - "description": "Configure the following properties on the color field component.", - "isPublicDocs": true, + "description": "The color field custom element class that renders a color input field with integrated visual picker in the Shopify admin interface. This component allows merchants to select colors by typing hex values or using an interactive color picker, with optional support for transparency (alpha channel).", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -52461,7 +58718,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", @@ -52484,7 +58741,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\"", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -52492,35 +58749,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -52528,14 +58785,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -52543,7 +58800,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -52567,7 +58824,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -52583,7 +58840,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -52591,23 +58848,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -52645,7 +58909,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -52653,24 +58917,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ColorField\n extends PreactFieldElement\n implements ColorFieldProps\n{\n accessor alpha: ColorFieldProps['alpha'];\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n setInternalValue(value: string, normalize: boolean): void;\n}" + "value": "declare class ColorField extends ColorFieldBase implements ColorFieldProps {\n constructor();\n}" }, "ColorPicker": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorPicker", - "description": "Configure the following properties on the color picker component.", - "isPublicDocs": true, + "description": "A visual color picker component that allows users to select colors from a color spectrum interface.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -52678,154 +58956,138 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial color value when the field first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts interacting, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", "name": "formResetCallback", "value": "() => void", - "description": "A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@internals$2@11535", - "value": "ElementInternals", "description": "", "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true } ], - "value": "declare class ColorPicker extends BaseClass$2 implements ColorPickerProps {\n accessor alpha: boolean;\n accessor name: string;\n accessor defaultValue: string;\n get value(): string;\n set value(value: string);\n /**\n * A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`.\n */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class ColorPicker extends BaseClass implements ColorPickerProps {\n /**\n * Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.\n *\n * @default false\n */\n alpha: boolean;\n /**\n * The name of the picker, used when submitting form data.\n */\n name: string;\n /**\n * The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n defaultValue: string;\n /**\n * The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n}" }, "DateField": { "filePath": "src/surfaces/admin/components.ts", "name": "DateField", - "description": "Configure the following properties on the date field component.", - "isPublicDocs": true, + "description": "The date field custom element class that renders a date input field with integrated calendar picker in the Shopify admin interface. This component allows merchants to select dates by typing or using a visual calendar, with support for date range restrictions and day-of-week constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar picker, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar picker first opens, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "DateAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -52833,36 +59095,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "defaultValue": "\"\"" + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -52870,14 +59131,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -52885,7 +59146,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -52909,7 +59170,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -52933,7 +59194,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -52941,31 +59202,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected date in `YYYY-MM-DD` format. An empty string means no date is selected.", - "defaultValue": "\"\"" + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -53003,7 +59270,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -53011,78 +59278,139 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DateField\n extends PreactFieldElement\n implements DateFieldProps\n{\n accessor allow: DateFieldProps['allow'];\n accessor disallow: DateFieldProps['disallow'];\n accessor allowDays: DateFieldProps['allowDays'];\n accessor disallowDays: DateFieldProps['disallowDays'];\n set view(view: string);\n get view(): string;\n accessor defaultView: DateFieldProps['defaultView'];\n constructor();\n}" + "value": "declare class DateField extends DateFieldBase implements DateFieldProps {\n constructor();\n}" }, "DateAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "DateAutocompleteField", "value": "'bday-day' | 'bday-month' | 'bday-year' | 'bday' | 'cc-expiry-month' | 'cc-expiry-year' | 'cc-expiry'", - "description": "Represents autocomplete values that are valid for date input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for date-based inputs.\n\nAvailable values:\n- `bday` - Complete birthday date\n- `bday-day` - Day component of a birthday (1-31)\n- `bday-month` - Month component of a birthday (1-12)\n- `bday-year` - Year component of a birthday (1990)\n- `cc-expiry` - Complete credit card expiration date\n- `cc-expiry-month` - Month component of a credit card expiration date (1-12)\n- `cc-expiry-year` - Year component of a credit card expiration date (2025)", - "isPublicDocs": true + "description": "" }, "DatePicker": { "filePath": "src/surfaces/admin/components.ts", "name": "DatePicker", - "description": "Configure the following properties on the date picker component.", - "isPublicDocs": true, + "description": "The date picker custom element class that renders a standalone calendar interface in the Shopify admin. This component allows merchants to select single dates or date ranges using an interactive calendar with month/year navigation, date constraints, and day-of-week restrictions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar first renders, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"single\" | \"range\"", - "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "description": "The type of date selection allowed. Available values: `single`, `range`.", "defaultValue": "\"single\"" }, { @@ -53090,7 +59418,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initially selected date(s) when the component first renders. An empty string means no date is initially selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The initial selected date or date range when the picker first renders, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -53098,14 +59426,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "value", "value": "string", - "description": "The currently selected date(s). An empty string means no date is selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The currently selected date or date range, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -53119,19 +59447,26 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@dirtyStateSymbol@11579", - "value": "boolean", + "name": "__@internals$1@16931", + "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$1@11578", - "value": "ElementInternals", + "name": "__@dirtyStateSymbol@16932", + "value": "boolean", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -53177,7 +59512,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -53185,17 +59520,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DatePicker extends BaseClass$1 implements DatePickerProps {\n accessor defaultView: string;\n set view(view: string);\n get view(): string;\n accessor allow: DatePickerProps['allow'];\n accessor disallow: DatePickerProps['disallow'];\n accessor allowDays: DatePickerProps['allowDays'];\n accessor disallowDays: DatePickerProps['disallowDays'];\n accessor type: DatePickerProps['type'];\n accessor defaultValue: DatePickerProps['defaultValue'];\n accessor name: DatePickerProps['name'];\n set value(value: string);\n get value(): string;\n /** @private */\n [dirtyStateSymbol]: boolean;\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DatePicker\n extends DatePickerBase\n implements DatePickerProps\n{\n constructor();\n}" }, "DropZone": { "filePath": "src/surfaces/admin/components.ts", "name": "DropZone", - "description": "Configure the following properties on the drop zone component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -53217,29 +59566,29 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -53255,14 +59604,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -53292,7 +59641,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@setFiles@11614", + "name": "__@setFiles@16968", "value": "(files: File[]) => void", "description": "", "isPrivate": true @@ -53300,7 +59649,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@getFileInput@11616", + "name": "__@getFileInput@16970", "value": "() => HTMLInputElement", "description": "", "isPrivate": true @@ -53308,11 +59657,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals@11615", + "name": "__@internals@16969", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -53358,7 +59714,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -53366,17 +59722,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DropZone extends BaseClass implements DropZoneProps {\n accessor accept: DropZoneProps['accept'];\n accessor accessibilityLabel: DropZoneProps['accessibilityLabel'];\n accessor disabled: DropZoneProps['disabled'];\n accessor error: DropZoneProps['error'];\n accessor label: DropZoneProps['label'];\n accessor labelAccessibilityVisibility: DropZoneProps['labelAccessibilityVisibility'];\n accessor multiple: DropZoneProps['multiple'];\n accessor name: DropZoneProps['name'];\n accessor required: DropZoneProps['required'];\n get value(): string;\n /** This sets the input value for a file type, which cannot be set programatically, so it can only be reset. */\n set value(value: '' | null);\n get files(): File[];\n set files(files: File[]);\n /** @private */\n [setFiles](files: File[]): void;\n /** @private */\n [getFileInput](): ReplaceType<\n Element | null | undefined,\n Element,\n HTMLInputElement\n >;\n\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DropZone extends DropZoneBase implements DropZoneProps {\n constructor();\n}" }, "Divider": { "filePath": "src/surfaces/admin/components.ts", "name": "Divider", - "description": "Configure the following properties on the divider component.", - "isPublicDocs": true, + "description": "A divider is a visual separator that creates a line between different sections of content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -53394,6 +59764,13 @@ "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -53439,7 +59816,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -53447,32 +59824,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Divider extends PreactCustomElement implements DividerProps {\n accessor direction: DividerProps['direction'];\n accessor color: DividerProps['color'];\n constructor();\n}" + "value": "declare class Divider extends PolarisCustomElement implements DividerProps {\n /**\n * The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n *\n * - `inline`: Horizontal divider for separating vertically stacked content\n * - `block`: Vertical divider for separating horizontally arranged content\n *\n * @default 'inline'\n */\n direction: DividerProps['direction'];\n /**\n * The visual prominence of the divider line.\n *\n * - `base`: Standard divider for most separations (default)\n * - `strong`: More prominent divider for major section breaks\n *\n * @default 'base'\n */\n color: DividerProps['color'];\n constructor();\n}" }, "EmailField": { "filePath": "src/surfaces/admin/components.ts", "name": "EmailField", - "description": "Configure the following properties on the email field component.", - "isPublicDocs": true, + "description": "The email field custom element class that renders an email input field in the Shopify admin interface. This component allows merchants to enter email addresses with automatic validation and optimized mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | EmailAutocompleteField | `section-${string} email` | `section-${string} home email` | `section-${string} mobile email` | `section-${string} fax email` | `section-${string} pager email` | \"shipping email\" | \"shipping home email\" | \"shipping mobile email\" | \"shipping fax email\" | \"shipping pager email\" | \"billing email\" | \"billing home email\" | \"billing mobile email\" | \"billing fax email\" | \"billing pager email\" | `section-${string} shipping email` | `section-${string} shipping home email` | `section-${string} shipping mobile email` | `section-${string} shipping fax email` | `section-${string} shipping pager email` | `section-${string} billing email` | `section-${string} billing home email` | `section-${string} billing mobile email` | `section-${string} billing fax email` | `section-${string} billing pager email`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint as to the intended content of the field for autocomplete purposes.", + "defaultValue": "'email'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -53480,50 +59871,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -53531,14 +59915,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -53546,7 +59930,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -53570,7 +59954,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -53594,7 +59978,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -53602,23 +59986,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -53656,7 +60054,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -53664,32 +60062,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class EmailField\n extends PreactFieldElement\n implements EmailFieldProps\n{\n accessor autocomplete: EmailFieldProps['autocomplete'];\n accessor maxLength: EmailFieldProps['maxLength'];\n accessor minLength: EmailFieldProps['minLength'];\n /**\n * The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class EmailField extends EmailFieldBase implements EmailFieldProps {\n constructor();\n}" }, "EmailAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "EmailAutocompleteField", "value": "'email' | 'home email' | 'mobile email' | 'fax email' | 'pager email'", - "description": "Represents autocomplete values that are valid for email input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for email inputs.\n\nAvailable values:\n- `email` - Primary email address\n- `home email` - Home email address\n- `mobile email` - Mobile device email address\n- `fax email` - Fax machine email address\n- `pager email` - Pager device email address", - "isPublicDocs": true + "description": "" }, "Grid": { "filePath": "src/surfaces/admin/components.ts", "name": "Grid", - "description": "Configure the following properties on the grid component.", - "isPublicDocs": true, + "description": "A grid is a layout component that arranges its children in rows and columns with precise control over sizing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridTemplateColumns", "value": "string", - "description": "The columns in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid columns.", "defaultValue": "'none'" }, { @@ -53697,7 +60108,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridTemplateRows", "value": "string", - "description": "The rows in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid rows.", "defaultValue": "'none'" }, { @@ -53705,7 +60116,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyItems", "value": "\"\" | JustifyItemsKeyword", - "description": "Aligns the grid items along the inline axis.", + "description": "The alignment of grid items along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -53713,7 +60124,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "\"\" | AlignItemsKeyword", - "description": "Aligns the grid items along the block axis.", + "description": "The alignment of grid items along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -53721,7 +60132,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeItems", "value": "AlignItemsKeyword | \"normal normal\" | \"normal stretch\" | \"normal baseline\" | \"normal first baseline\" | \"normal last baseline\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch baseline\" | \"stretch first baseline\" | \"stretch last baseline\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline baseline\" | \"baseline first baseline\" | \"baseline last baseline\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline baseline\" | \"first baseline first baseline\" | \"first baseline last baseline\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline baseline\" | \"last baseline first baseline\" | \"last baseline last baseline\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start baseline\" | \"start first baseline\" | \"start last baseline\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end baseline\" | \"end first baseline\" | \"end last baseline\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center baseline\" | \"center first baseline\" | \"center last baseline\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start baseline\" | \"unsafe start first baseline\" | \"unsafe start last baseline\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end baseline\" | \"unsafe end first baseline\" | \"unsafe end last baseline\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center baseline\" | \"unsafe center first baseline\" | \"unsafe center last baseline\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start baseline\" | \"safe start first baseline\" | \"safe start last baseline\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end baseline\" | \"safe end first baseline\" | \"safe end last baseline\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center baseline\" | \"safe center first baseline\" | \"safe center last baseline\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\"", - "description": "A shorthand property for `justify-items` and `align-items`.", + "description": "A shorthand for setting both `alignItems` and `justifyItems`.", "defaultValue": "'normal normal'" }, { @@ -53729,7 +60140,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "\"\" | JustifyContentKeyword", - "description": "Aligns the grid along the inline axis. This overrides the inline value of `placeContent`.", + "description": "The alignment of the grid along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -53737,7 +60148,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "\"\" | AlignContentKeyword", - "description": "Aligns the grid along the block axis. This overrides the block value of `placeContent`.", + "description": "The alignment of the grid along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -53745,7 +60156,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeContent", "value": "\"normal normal\" | \"normal stretch\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\" | AlignContentKeyword | \"normal space-between\" | \"normal space-around\" | \"normal space-evenly\" | \"baseline space-between\" | \"baseline space-around\" | \"baseline space-evenly\" | \"first baseline space-between\" | \"first baseline space-around\" | \"first baseline space-evenly\" | \"last baseline space-between\" | \"last baseline space-around\" | \"last baseline space-evenly\" | \"start space-between\" | \"start space-around\" | \"start space-evenly\" | \"end space-between\" | \"end space-around\" | \"end space-evenly\" | \"center space-between\" | \"center space-around\" | \"center space-evenly\" | \"unsafe start space-between\" | \"unsafe start space-around\" | \"unsafe start space-evenly\" | \"unsafe end space-between\" | \"unsafe end space-around\" | \"unsafe end space-evenly\" | \"unsafe center space-between\" | \"unsafe center space-around\" | \"unsafe center space-evenly\" | \"safe start space-between\" | \"safe start space-around\" | \"safe start space-evenly\" | \"safe end space-between\" | \"safe end space-around\" | \"safe end space-evenly\" | \"safe center space-between\" | \"safe center space-around\" | \"safe center space-evenly\" | \"stretch space-between\" | \"stretch space-around\" | \"stretch space-evenly\" | \"space-between normal\" | \"space-between start\" | \"space-between end\" | \"space-between center\" | \"space-between unsafe start\" | \"space-between unsafe end\" | \"space-between unsafe center\" | \"space-between safe start\" | \"space-between safe end\" | \"space-between safe center\" | \"space-between stretch\" | \"space-between space-between\" | \"space-between space-around\" | \"space-between space-evenly\" | \"space-around normal\" | \"space-around start\" | \"space-around end\" | \"space-around center\" | \"space-around unsafe start\" | \"space-around unsafe end\" | \"space-around unsafe center\" | \"space-around safe start\" | \"space-around safe end\" | \"space-around safe center\" | \"space-around stretch\" | \"space-around space-between\" | \"space-around space-around\" | \"space-around space-evenly\" | \"space-evenly normal\" | \"space-evenly start\" | \"space-evenly end\" | \"space-evenly center\" | \"space-evenly unsafe start\" | \"space-evenly unsafe end\" | \"space-evenly unsafe center\" | \"space-evenly safe start\" | \"space-evenly safe end\" | \"space-evenly safe center\" | \"space-evenly stretch\" | \"space-evenly space-between\" | \"space-evenly space-around\" | \"space-evenly space-evenly\"", - "description": "A shorthand property for `justify-content` and `align-content`.", + "description": "A shorthand for setting both `alignContent` and `justifyContent`.", "defaultValue": "'normal normal'" }, { @@ -53753,7 +60164,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows and columns.", "defaultValue": "'none'" }, { @@ -53761,7 +60172,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "s spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows.", "defaultValue": "'' - meaning no override" }, { @@ -53769,7 +60180,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid columns.", "defaultValue": "'' - meaning no override" }, { @@ -53777,7 +60188,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -53785,7 +60196,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -53793,7 +60204,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -53801,7 +60212,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -53809,7 +60220,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -53817,7 +60228,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -53825,7 +60236,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -53833,7 +60244,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -53841,7 +60252,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -53849,7 +60260,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -53857,7 +60268,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -53865,7 +60276,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -53873,7 +60284,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -53881,7 +60292,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -53889,7 +60300,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -53897,7 +60308,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -53905,7 +60316,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -53925,7 +60336,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -53933,7 +60344,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -53941,7 +60352,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -53949,7 +60360,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -53957,14 +60368,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -53972,9 +60383,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -54020,7 +60438,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -54028,96 +60446,101 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n accessor gridTemplateColumns: GridProps['gridTemplateColumns'];\n accessor gridTemplateRows: GridProps['gridTemplateRows'];\n accessor justifyItems: GridProps['justifyItems'];\n accessor alignItems: GridProps['alignItems'];\n accessor placeItems: GridProps['placeItems'];\n accessor justifyContent: GridProps['justifyContent'];\n accessor alignContent: GridProps['alignContent'];\n accessor placeContent: GridProps['placeContent'];\n accessor gap: GridProps['gap'];\n accessor rowGap: GridProps['rowGap'];\n accessor columnGap: GridProps['columnGap'];\n}" + "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n /**\n * The template that defines the grid columns.\n */\n gridTemplateColumns: GridProps['gridTemplateColumns'];\n /**\n * The template that defines the grid rows.\n */\n gridTemplateRows: GridProps['gridTemplateRows'];\n /**\n * The alignment of grid items along the inline axis.\n */\n justifyItems: GridProps['justifyItems'];\n /**\n * The alignment of grid items along the block axis.\n */\n alignItems: GridProps['alignItems'];\n /**\n * A shorthand for setting both `alignItems` and `justifyItems`.\n */\n placeItems: GridProps['placeItems'];\n /**\n * The alignment of the grid along the inline axis.\n */\n justifyContent: GridProps['justifyContent'];\n /**\n * The alignment of the grid along the block axis.\n */\n alignContent: GridProps['alignContent'];\n /**\n * A shorthand for setting both `alignContent` and `justifyContent`.\n */\n placeContent: GridProps['placeContent'];\n /**\n * The spacing between grid rows and columns.\n */\n gap: GridProps['gap'];\n /**\n * The spacing between grid rows.\n */\n rowGap: GridProps['rowGap'];\n /**\n * The spacing between grid columns.\n */\n columnGap: GridProps['columnGap'];\n}" }, "JustifyItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.\n\nLearn more about the [justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).", - "isPublicDocs": true + "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis." }, "BaselinePosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BaselinePosition", "value": "'baseline' | 'first baseline' | 'last baseline'", - "description": "Represents baseline alignment positions used to align items relative to their baselines.\n- `baseline`: Aligns to the baseline of the parent.\n- `first baseline`: Aligns to the first baseline of the parent.\n- `last baseline`: Aligns to the last baseline of the parent.", - "isPublicDocs": true + "description": "" }, "OverflowPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "OverflowPosition", "value": "`unsafe ${ContentPosition}` | `safe ${ContentPosition}`", - "description": "Represents content positioning with overflow behavior control. Use `safe` to prevent content from becoming inaccessible when it overflows, or `unsafe` to allow overflow regardless of accessibility.", - "isPublicDocs": true + "description": "" }, "ContentPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentPosition", "value": "'center' | 'start' | 'end'", - "description": "Defines the position of content along an axis.\n- `center`: Centers the content.\n- `start`: Aligns content to the start.\n- `end`: Aligns content to the end.", - "isPublicDocs": true + "description": "" }, "AlignItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Align items sets the align-self value on all direct children as a group.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isPublicDocs": true + "description": "Align items sets the align-self value on all direct children as a group." }, "JustifyContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyContentKeyword", "value": "'normal' | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", - "isPublicDocs": true + "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container." }, "ContentDistribution": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentDistribution", "value": "'space-between' | 'space-around' | 'space-evenly' | 'stretch'", - "description": "Defines how space is distributed between and around content items in flex and grid layouts.\n- `space-between`: Distributes items evenly with the first item at the start and last at the end.\n- `space-around`: Distributes items evenly with equal space around each item.\n- `space-evenly`: Distributes items evenly with equal space between them.\n- `stretch`: Stretches items to fill the container.", - "isPublicDocs": true + "description": "" }, "AlignContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignContentKeyword", "value": "'normal' | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isPublicDocs": true + "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis." }, "SpacingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SpacingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the spacing size between elements, using the standard size scale or `none` for no spacing.", - "isPublicDocs": true + "description": "" }, "GridItem": { "filePath": "src/surfaces/admin/components.ts", "name": "GridItem", - "description": "The grid item component represents a single cell within a grid layout, allowing you to control how content is positioned and sized within the grid. Use grid item as a child of grid to specify column span, row span, and positioning for individual content areas.\n\nGrid item supports precise placement control through column and row properties, enabling you to create complex layouts where different items occupy varying amounts of space or appear in specific grid positions.", - "isPublicDocs": true, + "description": "A grid item is a child of a grid that can be positioned within specific rows and columns.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridColumn", "value": "\"auto\" | `span ${number}`", - "description": "The number of columns the item will span across.\n\nLearn more about the [grid-column property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).", + "description": "The column position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -54125,7 +60548,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridRow", "value": "\"auto\" | `span ${number}`", - "description": "The number of rows the item will span across.\n\nLearn more about the [grid-row property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).", + "description": "The row position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -54133,7 +60556,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -54141,7 +60564,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -54149,7 +60572,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -54157,7 +60580,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -54165,7 +60588,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -54173,7 +60596,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -54181,7 +60604,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -54189,7 +60612,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -54197,7 +60620,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -54205,7 +60628,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -54213,7 +60636,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -54221,7 +60644,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -54229,7 +60652,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -54237,7 +60660,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -54245,7 +60668,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -54253,7 +60676,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -54261,7 +60684,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -54281,7 +60704,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -54289,7 +60712,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -54297,7 +60720,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -54305,7 +60728,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -54313,14 +60736,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -54328,9 +60751,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -54376,7 +60806,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -54384,24 +60814,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class GridItem extends BoxElement implements GridItemProps {\n accessor gridColumn: GridItemProps['gridColumn'];\n accessor gridRow: GridItemProps['gridRow'];\n constructor();\n}" + "value": "declare class GridItem extends BoxElement implements GridItemProps {\n /**\n * The column position and span of the grid item.\n */\n gridColumn: GridItemProps['gridColumn'];\n /**\n * The row position and span of the grid item.\n */\n gridRow: GridItemProps['gridRow'];\n constructor();\n}" }, "Heading": { "filePath": "src/surfaces/admin/components.ts", "name": "Heading", - "description": "Configure the following properties on the heading component.", - "isPublicDocs": true, + "description": "A custom element for displaying hierarchical section titles and headings with appropriate semantic meaning and visual styling. Use Heading to structure your content with proper heading levels for both visual hierarchy and accessibility.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"heading\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The ARIA role for the heading. Set to `'heading'` (the default) for standard heading semantics, or `'presentation'` / `'none'` to remove heading semantics for decorative use.", "defaultValue": "'heading'" }, { @@ -54409,7 +60853,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lineClamp", "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", "defaultValue": "Infinity - no truncation is applied" }, { @@ -54417,9 +60861,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -54465,7 +60916,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -54473,47 +60924,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Heading extends PreactCustomElement implements HeadingProps {\n accessor accessibilityRole: HeadingProps['accessibilityRole'];\n accessor lineClamp: HeadingProps['lineClamp'];\n accessor accessibilityVisibility: HeadingProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Heading extends HeadingBase implements HeadingProps {\n constructor();\n}" }, "Icon": { "filePath": "src/surfaces/admin/components.ts", "name": "Icon", - "description": "Configure the following properties on the icon component.", - "isPublicDocs": true, + "description": "An icon displays a graphical symbol from the icon library.", "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", + "description": "The color tone of the icon based on its semantic meaning.", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "The icon to display from the icon library.\n\nSet to a valid icon name to display that icon. To hide the icon completely, use an empty string `''`. To reserve the icon's space without displaying an icon, use `'empty'`." + "value": "\"\" | IconType", + "description": "The type of icon to display." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color emphasis of the icon.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"base\"", - "description": "The size of the icon.\n\n- `small`: Smaller icon suitable for inline use within text or compact UI elements.\n- `base`: Default size that works well for standalone icons and standard use cases.", + "description": "The size of the icon.", "defaultValue": "'base'" }, { @@ -54521,7 +60986,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The element that this icon should show interest for when activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -54568,7 +61040,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -54576,53 +61048,67 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Icon extends PreactCustomElement implements IconProps {\n accessor color: IconProps['color'];\n accessor tone: IconProps['tone'];\n accessor type: IconProps['type'];\n accessor size: IconProps['size'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Icon extends IconBase implements IconProps {\n /**\n * The color tone of the icon based on its semantic meaning.\n */\n tone: IconProps['tone'];\n /**\n * The type of icon to display.\n */\n type: IconProps['type'];\n constructor();\n}" }, "Image": { "filePath": "src/surfaces/admin/components.ts", "name": "Image", - "description": "Configure the following properties on the image component.", - "isPublicDocs": true, + "description": "An image displays pictures with configurable sizing, loading behavior, and borders.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "srcSet", "value": "string", - "description": "A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n\nLearn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset)." + "description": "A set of source images with different sizes for responsive loading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "sizes", "value": "string", - "description": "A set of media conditions and their corresponding sizes.\n\nLearn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes)." + "description": "The sizes of the image at different viewport widths." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "aspectRatio", "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", - "description": "The aspect ratio of the image.\n\nThe rendering of the image will depend on the `inlineSize` value:\n\n- `inlineSize=\"fill\"`: the aspect ratio will be respected and the image will take the necessary space.\n- `inlineSize=\"auto\"`: the image will not render until it has loaded and the aspect ratio will be ignored.\n\nFor example, if the value is set as `50 / 100`, the getter returns `50 / 100`. If the value is set as `0.5`, the getter returns `0.5 / 1`.\n\nLearn more about the [aspect-ratio property](https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio).", + "description": "The aspect ratio of the image as a width-to-height ratio.", "defaultValue": "'1/1'" }, { @@ -54630,7 +61116,7 @@ "syntaxKind": "PropertyDeclaration", "name": "objectFit", "value": "\"contain\" | \"cover\"", - "description": "The image resizing behavior to fit within its container.\n\n- `contain`: Scales the image to fit within the container while maintaining its aspect ratio. The entire image is visible, but might leave empty space.\n- `cover`: Scales the image to fill the entire container while maintaining its aspect ratio. The image might be cropped to fit.\n\nThe image is always positioned in the center of the container.\n\nLearn more about the [object-fit property](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).", + "description": "How the image should be resized to fit its container.", "defaultValue": "'contain'" }, { @@ -54638,7 +61124,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "\"eager\" | \"lazy\"", - "description": "The loading strategy for the image.\n\n- `eager`: Immediately loads the image, irrespective of its position within the visible viewport.\n- `lazy`: Delays loading the image until it approaches a specified distance from the viewport.\n\nLearn more about the [loading attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading).", + "description": "When the image should be loaded.", "defaultValue": "'eager'" }, { @@ -54646,7 +61132,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"img\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The accessibility role for the image.", "defaultValue": "'img'" }, { @@ -54654,7 +61140,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "\"auto\" | \"fill\"", - "description": "The displayed inline width of the image.\n\n- `fill`: the image will takes up 100% of the available inline size.\n- `auto`: the image will be displayed at its natural size.\n\nLearn more about the [width attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#width).", + "description": "The inline size (width in horizontal writing modes) of the image.", "defaultValue": "'fill'" }, { @@ -54662,35 +61148,23 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied around the image using shorthand syntax to specify width, color, and style in a single property.", - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "description": "Whether to show a border around the image.", + "defaultValue": "'none' - equivalent to `none base auto`." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderWidth", - "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderStyle", - "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image.", "defaultValue": "'' - meaning no override" }, { @@ -54698,17 +61172,24 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "The color of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the image's corners using the design system's radius scale.", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image.", "defaultValue": "'none'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -54754,7 +61235,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -54762,24 +61243,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Image extends PreactCustomElement implements ImageProps {\n accessor src: ImageProps['src'];\n accessor srcSet: ImageProps['srcSet'];\n accessor sizes: ImageProps['sizes'];\n accessor alt: ImageProps['alt'];\n accessor aspectRatio: ImageProps['aspectRatio'];\n accessor objectFit: ImageProps['objectFit'];\n accessor loading: ImageProps['loading'];\n accessor accessibilityRole: ImageProps['accessibilityRole'];\n accessor inlineSize: ImageProps['inlineSize'];\n /**\n * A border applied around the image using shorthand syntax to specify width, color, and style in a single property.\n */\n accessor border: ImageProps['border'];\n /**\n * The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.\n */\n accessor borderWidth: ImageProps['borderWidth'];\n /**\n * The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.\n */\n accessor borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.\n */\n accessor borderColor: ImageProps['borderColor'];\n /**\n * The roundedness of the image's corners using the design system's radius scale.\n */\n accessor borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + "value": "declare class Image extends PolarisCustomElement implements ImageProps {\n /**\n * The URL of the image to display.\n */\n src: ImageProps['src'];\n /**\n * A set of source images with different sizes for responsive loading.\n */\n srcSet: ImageProps['srcSet'];\n /**\n * The sizes of the image at different viewport widths.\n */\n sizes: ImageProps['sizes'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ImageProps['alt'];\n /**\n * The aspect ratio of the image as a width-to-height ratio.\n */\n aspectRatio: ImageProps['aspectRatio'];\n /**\n * How the image should be resized to fit its container.\n */\n objectFit: ImageProps['objectFit'];\n /**\n * When the image should be loaded.\n */\n loading: ImageProps['loading'];\n /**\n * The accessibility role for the image.\n */\n accessibilityRole: ImageProps['accessibilityRole'];\n /**\n * The inline size (width in horizontal writing modes) of the image.\n */\n inlineSize: ImageProps['inlineSize'];\n /**\n * Whether to show a border around the image.\n */\n border: ImageProps['border'];\n /**\n * The width of the border around the image.\n */\n borderWidth: ImageProps['borderWidth'];\n /**\n * The style of the border around the image.\n */\n borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image.\n */\n borderColor: ImageProps['borderColor'];\n /**\n * The radius of the border corners around the image.\n */\n borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + }, + "BorderRadiusKeyword": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "BorderRadiusKeyword", + "value": "SizeKeyword | 'max' | 'none'", + "description": "" }, "Link": { "filePath": "src/surfaces/admin/components.ts", "name": "Link", - "description": "Configure the following properties on the link component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", "defaultValue": "'auto'" }, { @@ -54787,21 +61289,21 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -54809,14 +61311,21 @@ "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "lang", "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)." + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -54863,7 +61372,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -54871,15 +61380,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -54887,24 +61411,30 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Link extends Link_base implements LinkProps {\n accessor tone: LinkProps['tone'];\n accessor accessibilityLabel: LinkProps['accessibilityLabel'];\n accessor href: LinkProps['href'];\n accessor target: LinkProps['target'];\n accessor download: LinkProps['download'];\n accessor lang: LinkProps['lang'];\n constructor();\n}" + "value": "declare class Link extends LinkBase implements LinkProps {\n tone: LinkProps['tone'];\n constructor();\n}" }, "ListItem": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItem", - "description": "The list item component represents a single entry within an ordered list or unordered list. Use list item to structure individual points, steps, or items within a list, with each item automatically receiving appropriate list markers (bullets or numbers) from its parent list.\n\nList item must be used as a direct child of ordered list or unordered list components. Each list item can contain text, inline formatting, or other components to create rich list content.", - "isPublicDocs": true, + "description": "A component that represents a single item within an ordered list or unordered list.\n\nUse list item as a child of ordered list or unordered list to create properly structured and accessible list content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -54950,7 +61480,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -54958,24 +61488,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ListItem extends PreactCustomElement implements ListItemProps {\n constructor();\n}" + "value": "declare class ListItem extends PolarisCustomElement implements ListItemProps {\n constructor();\n}" }, "Menu": { "filePath": "src/surfaces/admin/components.ts", "name": "Menu", - "description": "Configure the following properties on the menu component.", - "isPublicDocs": true, + "description": "A component that displays a contextual list of actions or options, which is typically triggered by a button or other activator element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the menu for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", @@ -54996,7 +61540,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -55004,7 +61548,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -55012,11 +61556,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -55046,7 +61597,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -55054,24 +61605,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n accessor accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n /**\n * A label that describes the menu for assistive technologies.\n */\n accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "MoneyField": { "filePath": "src/surfaces/admin/components.ts", "name": "MoneyField", - "description": "Configure the following properties on the money field component.", - "isPublicDocs": true, + "description": "The money field custom element class that renders a monetary input field in the Shopify admin interface. This component allows merchants to enter currency amounts with automatic formatting, decimal precision, and validation against minimum and maximum values.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum monetary value allowed in the field.", "defaultValue": "Infinity" }, { @@ -55079,9 +61644,17 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum monetary value allowed in the field.", "defaultValue": "-Infinity" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "currencyCode", + "value": "\"auto\" | CurrencyCode", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -55094,7 +61667,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "string", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -55102,35 +61675,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -55138,14 +61711,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -55153,7 +61726,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -55177,7 +61750,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -55201,7 +61774,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -55209,23 +61782,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -55263,7 +61843,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -55271,17 +61851,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class MoneyField\n extends PreactFieldElement\n implements MoneyFieldProps\n{\n accessor max: MoneyFieldProps['max'];\n accessor min: MoneyFieldProps['min'];\n /**\n * The current monetary value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string representing the amount in the store's currency.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class MoneyField extends MoneyFieldBase implements MoneyFieldProps {\n constructor();\n}" + }, + "CurrencyCode": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CurrencyCode", + "value": "'USD' | 'EUR' | 'GBP' | 'CAD' | 'AFN' | 'ALL' | 'DZD' | 'AOA' | 'ARS' | 'AMD' | 'AWG' | 'AUD' | 'BBD' | 'AZN' | 'BDT' | 'BSD' | 'BHD' | 'BIF' | 'BZD' | 'BMD' | 'BTN' | 'BAM' | 'BRL' | 'BOB' | 'BWP' | 'BND' | 'BGN' | 'MMK' | 'KHR' | 'CVE' | 'KYD' | 'XAF' | 'CLP' | 'CNY' | 'COP' | 'KMF' | 'CDF' | 'CRC' | 'HRK' | 'CZK' | 'DKK' | 'DOP' | 'XCD' | 'EGP' | 'ETB' | 'XPF' | 'FJD' | 'GMD' | 'GHS' | 'GTQ' | 'GYD' | 'GEL' | 'HTG' | 'HNL' | 'HKD' | 'HUF' | 'ISK' | 'INR' | 'IDR' | 'ILS' | 'IQD' | 'JMD' | 'JPY' | 'JEP' | 'JOD' | 'KZT' | 'KES' | 'KWD' | 'KGS' | 'LAK' | 'LVL' | 'LBP' | 'LSL' | 'LRD' | 'LTL' | 'MGA' | 'MKD' | 'MOP' | 'MWK' | 'MVR' | 'MXN' | 'MYR' | 'MUR' | 'MDL' | 'MAD' | 'MNT' | 'MZN' | 'NAD' | 'NPR' | 'ANG' | 'NZD' | 'NIO' | 'NGN' | 'NOK' | 'OMR' | 'PAB' | 'PKR' | 'PGK' | 'PYG' | 'PEN' | 'PHP' | 'PLN' | 'QAR' | 'RON' | 'RUB' | 'RWF' | 'WST' | 'SAR' | 'RSD' | 'SCR' | 'SGD' | 'SDG' | 'SYP' | 'ZAR' | 'KRW' | 'SSP' | 'SBD' | 'LKR' | 'SRD' | 'SZL' | 'SEK' | 'CHF' | 'TWD' | 'THB' | 'TZS' | 'TTD' | 'TND' | 'TRY' | 'TMT' | 'UGX' | 'UAH' | 'AED' | 'UYU' | 'UZS' | 'VUV' | 'VND' | 'XOF' | 'YER' | 'ZMW' | 'BYN' | 'BYR' | 'DJF' | 'ERN' | 'FKP' | 'GIP' | 'GNF' | 'IRR' | 'KID' | 'LYD' | 'MRU' | 'SLL' | 'SHP' | 'SOS' | 'STD' | 'STN' | 'TJS' | 'TOP' | 'VED' | 'VEF' | 'VES' | 'XXX'", + "description": "" }, "NumberField": { "filePath": "src/surfaces/admin/components.ts", "name": "NumberField", - "description": "Configure the following properties on the number field component.", - "isPublicDocs": true, + "description": "The number field custom element class that renders a numeric input field in the Shopify admin interface. This component allows merchants to enter numbers with automatic validation and prefix/suffix display.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -55295,7 +61896,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inputMode", "value": "\"decimal\" | \"numeric\"", - "description": "The type of virtual keyboard to display on mobile devices.\n\n- `decimal`: Shows a numeric keyboard with a decimal point, suitable for prices or measurements.\n- `numeric`: Shows a numeric keyboard without a decimal point, suitable for whole numbers like quantities.\n\nLearn more about the [inputmode attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode).", + "description": "The input mode hint for mobile keyboards. Available values include:\n- `numeric`: Shows a numeric keypad optimized for entering numbers\n- `decimal`: Shows a numeric keypad with decimal point support\n- `tel`: Shows a telephone keypad", "defaultValue": "'decimal'" }, { @@ -55303,7 +61904,7 @@ "syntaxKind": "PropertyDeclaration", "name": "step", "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "description": "The granularity that the value must adhere to, or the keyword `any`. This controls the increment/decrement step size.", "defaultValue": "1" }, { @@ -55311,7 +61912,7 @@ "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum numeric value allowed in the field.", "defaultValue": "Infinity" }, { @@ -55319,7 +61920,7 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum numeric value allowed in the field.", "defaultValue": "-Infinity" }, { @@ -55327,7 +61928,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the user's input, such as a currency symbol.", "defaultValue": "''" }, { @@ -55335,7 +61936,7 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the user's input, such as a unit of measurement.", "defaultValue": "''" }, { @@ -55343,7 +61944,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | NumberAutocompleteField | `section-${string} one-time-code` | `section-${string} cc-number` | `section-${string} cc-csc` | \"shipping one-time-code\" | \"shipping cc-number\" | \"shipping cc-csc\" | \"billing one-time-code\" | \"billing cc-number\" | \"billing cc-csc\" | `section-${string} shipping one-time-code` | `section-${string} shipping cc-number` | `section-${string} shipping cc-csc` | `section-${string} billing one-time-code` | `section-${string} billing cc-number` | `section-${string} billing cc-csc`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -55351,35 +61952,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -55387,14 +61988,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -55402,7 +62003,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -55426,7 +62027,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -55450,7 +62051,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -55458,23 +62059,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -55512,7 +62120,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -55520,32 +62128,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class NumberField\n extends PreactFieldElement\n implements NumberFieldProps\n{\n /**\n * The current numeric value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string (decimal or integer).\n */\n get value(): string;\n set value(value: string);\n accessor inputMode: NumberFieldProps['inputMode'];\n accessor step: NumberFieldProps['step'];\n accessor max: NumberFieldProps['max'];\n accessor min: NumberFieldProps['min'];\n accessor prefix: NumberFieldProps['prefix'];\n accessor suffix: NumberFieldProps['suffix'];\n constructor();\n}" + "value": "declare class NumberField extends NumberFieldBase implements NumberFieldProps {\n constructor();\n}" }, "NumberAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "NumberAutocompleteField", "value": "'one-time-code' | 'cc-number' | 'cc-csc'", - "description": "Represents autocomplete values that are valid for number input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for numeric inputs.\n\nAvailable values:\n- `one-time-code` - One-time codes for authentication (OTP, 2FA codes)\n- `cc-number` - Credit card number\n- `cc-csc` - Credit card security code (CVV/CVC)", - "isPublicDocs": true + "description": "" }, "Option": { "filePath": "src/surfaces/admin/components.ts", "name": "Option", - "description": "Represents a single option within a select component. Use only as a child of s-select components.", - "isPublicDocs": true, + "description": "A single option within a select dropdown that users can choose.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the option is currently selected.", "defaultValue": "false" }, { @@ -55553,7 +62174,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the option should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -55561,16 +62182,23 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this option is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the option is disabled and can't be selected.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -55616,7 +62244,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -55624,24 +62252,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Option extends PreactCustomElement implements OptionProps {\n accessor selected: OptionProps['selected'];\n accessor defaultSelected: OptionProps['defaultSelected'];\n accessor value: OptionProps['value'];\n accessor disabled: OptionProps['disabled'];\n constructor();\n}" + "value": "declare class Option extends PolarisCustomElement implements OptionProps {\n /**\n * Whether the option is currently selected.\n */\n selected: OptionProps['selected'];\n /**\n * Whether the option should be selected when it's first rendered.\n */\n defaultSelected: OptionProps['defaultSelected'];\n /**\n * The value that's submitted with the form when this option is selected.\n */\n value: OptionProps['value'];\n /**\n * Whether the option is disabled and can't be selected.\n */\n disabled: OptionProps['disabled'];\n constructor();\n}" }, "OptionGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionGroup", - "description": "Represents a group of options within a select component. Use only as a child of `s-select` components.", - "isPublicDocs": true, + "description": "A group of related options within a select dropdown, displayed with a label.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the options within this group can be selected or not.", + "description": "Whether all options in the group are disabled and can't be selected.", "defaultValue": "false" }, { @@ -55649,7 +62291,14 @@ "syntaxKind": "PropertyDeclaration", "name": "label", "value": "string", - "description": "The user-facing label for this group of options." + "description": "The text that describes what this group of options represents." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -55696,7 +62345,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -55704,18 +62353,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OptionGroup\n extends PreactCustomElement\n implements OptionGroupProps\n{\n accessor disabled: OptionGroupProps['disabled'];\n accessor label: OptionGroupProps['label'];\n constructor();\n}" + "value": "declare class OptionGroup\n extends PolarisCustomElement\n implements OptionGroupProps\n{\n /**\n * Whether all options in the group are disabled and can't be selected.\n */\n disabled: OptionGroupProps['disabled'];\n /**\n * The text that describes what this group of options represents.\n */\n label: OptionGroupProps['label'];\n constructor();\n}" }, "OrderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "OrderedList", - "description": "Configure the following properties on the ordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a numbered list of items with automatic numbering and proper list semantics. Use ordered list when the sequence or order of items matters, such as instructions, rankings, or step-by-step processes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -55761,7 +62431,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -55769,48 +62439,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OrderedList\n extends PreactCustomElement\n implements OrderedListProps\n{\n constructor();\n}" + "value": "declare class OrderedList\n extends PolarisCustomElement\n implements OrderedListProps\n{\n constructor();\n}" }, "Paragraph": { "filePath": "src/surfaces/admin/components.ts", "name": "Paragraph", - "description": "Configure the following properties on the paragraph component.", - "isPublicDocs": true, + "description": "A custom element for displaying blocks of text content with consistent spacing and styling for readable body copy. Use Paragraph to render longer text content with proper line height and spacing between paragraphs.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "lineClamp", - "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", - "defaultValue": "Infinity - no truncation is applied" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the paragraph text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"caution\"", - "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "lineClamp", + "value": "number", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", + "defaultValue": "Infinity - no truncation is applied" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color of the paragraph text.", "defaultValue": "'base'" }, { @@ -55818,7 +62502,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -55826,9 +62510,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -55874,7 +62565,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -55882,24 +62573,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Paragraph extends PreactCustomElement implements ParagraphProps {\n accessor fontVariantNumeric: ParagraphProps['fontVariantNumeric'];\n accessor lineClamp: ParagraphProps['lineClamp'];\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: ParagraphProps['tone'];\n\n accessor color: ParagraphProps['color'];\n accessor dir: ParagraphProps['dir'];\n accessor accessibilityVisibility: ParagraphProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Paragraph extends ParagraphBase implements ParagraphProps {\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: ParagraphProps['tone'];\n constructor();\n}" }, "PasswordField": { "filePath": "src/surfaces/admin/components.ts", "name": "PasswordField", - "description": "Configure the following properties on the password field component.", - "isPublicDocs": true, + "description": "The password field custom element class that renders a password input field in the Shopify admin interface. This component allows merchants to enter passwords securely with characters automatically masked for privacy.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the password.", "defaultValue": "Infinity" }, { @@ -55907,22 +62612,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the password.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | PasswordAutocompleteField | `section-${string} current-password` | `section-${string} new-password` | \"shipping current-password\" | \"shipping new-password\" | \"billing current-password\" | \"billing new-password\" | `section-${string} shipping current-password` | `section-${string} shipping new-password` | `section-${string} billing current-password` | `section-${string} billing new-password`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -55930,35 +62628,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -55966,14 +62664,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -55981,7 +62679,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -56005,7 +62703,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -56029,7 +62727,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -56037,23 +62735,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -56091,7 +62803,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -56099,34 +62811,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class PasswordField\n extends PreactFieldElement\n implements PasswordFieldProps\n{\n accessor maxLength: PasswordFieldProps['maxLength'];\n accessor minLength: PasswordFieldProps['minLength'];\n /**\n * The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class PasswordField\n extends PasswordFieldBase\n implements PasswordFieldProps\n{\n constructor();\n}" }, "PasswordAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PasswordAutocompleteField", "value": "'current-password' | 'new-password'", - "description": "Represents autocomplete values that are valid for password input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for password inputs.\n\nAvailable values:\n- `current-password` - Existing password for login or authentication\n- `new-password` - New password when creating an account or changing password", - "isPublicDocs": true + "description": "" }, "QueryContainer": { "filePath": "src/surfaces/admin/components.ts", "name": "QueryContainer", - "description": "Configure the following properties on the query container component.", - "isPublicDocs": true, + "description": "A component that sets up a container query context, which lets child elements style themselves based on the container's size instead of the viewport size.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "containerName", "value": "string", - "description": "An identifier for this container that you can reference in CSS container queries to apply styles based on this specific container's size.\n\nAll query container components automatically receive a container name of `s-default`. You can omit the container name in your queries, so `@container (inline-size <= 300px)` is equivalent to `@container s-default (inline-size <= 300px)`.\n\nWhen you provide a custom `containerName`, it's added alongside `s-default`. For example, `containerName=\"product-card\"` results in `s-default product-card` being set on the `container-name` CSS property, allowing you to target this container with `@container product-card (inline-size <= 300px)`.\n\nLearn more about the [container-name property](https://developer.mozilla.org/en-US/docs/Web/CSS/container-name).", + "description": "The name of the container, which you can reference in CSS container queries.", "defaultValue": "''" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -56172,7 +62904,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -56180,24 +62912,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class QueryContainer\n extends PreactCustomElement\n implements QueryContainerProps\n{\n accessor containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" + "value": "declare class QueryContainer\n extends PolarisCustomElement\n implements QueryContainerProps\n{\n /**\n * The name of the container, which you can reference in CSS container queries.\n */\n containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" }, "SearchField": { "filePath": "src/surfaces/admin/components.ts", "name": "SearchField", - "description": "Configure the following properties on the search field component.", - "isPublicDocs": true, + "description": "A search field that lets users enter search queries with a search-specific input type.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters that can be entered in the field.", "defaultValue": "Infinity" }, { @@ -56205,22 +62951,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters that must be entered for the field to be valid.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -56228,35 +62967,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -56264,14 +63003,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -56279,7 +63018,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -56303,7 +63042,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -56327,7 +63066,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -56335,23 +63074,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -56389,7 +63142,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -56397,25 +63150,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class SearchField\n extends PreactFieldElement\n implements SearchFieldProps\n{\n accessor maxLength: SearchFieldProps['maxLength'];\n accessor minLength: SearchFieldProps['minLength'];\n /**\n * The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class SearchField extends SearchFieldBase implements SearchFieldProps {\n constructor();\n}" }, "TextAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" }, "Section": { "filePath": "src/surfaces/admin/components.ts", "name": "Section", - "description": "Configure the following properties on the section component.", - "isPublicDocs": true, + "description": "A section is a container that groups related content together with an optional heading.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -56425,28 +63191,43 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "The accessibility label for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The heading text displayed at the top of the section. This heading provides a title for the section's content and automatically uses the appropriate semantic heading level (h2, h3, h4) based on nesting depth to maintain proper document structure." + "description": "The heading text for the section." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "\"base\" | \"none\"", - "description": "The padding applied to all edges of the element.\n\n- `base`: applies padding that is appropriate for the element. Note that it might result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the section need to span to the edge of the section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "description": "Whether the section has padding.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -56463,14 +63244,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -56484,7 +63257,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -56492,59 +63265,73 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Section extends PreactCustomElement implements SectionProps {\n constructor();\n /** @private */\n connectedCallback(): void;\n accessor accessibilityLabel: SectionProps['accessibilityLabel'];\n accessor heading: SectionProps['heading'];\n accessor padding: SectionProps['padding'];\n}" + "value": "declare class Section extends SectionBase implements SectionProps {\n constructor();\n}" }, "Select": { "filePath": "src/surfaces/admin/components.ts", "name": "Select", - "description": "Configure the following properties on the select component.", - "isPublicDocs": true, + "description": "A select dropdown that lets users choose one option from a list.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier." + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the select." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the select when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the select is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "Text that appears in the select when no option is selected to provide a hint about what to choose." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether an option must be selected before the form can be submitted.", "defaultValue": "false" }, { @@ -56552,7 +63339,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -56576,7 +63363,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component." + "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected Option component." }, { "filePath": "src/surfaces/admin/components.ts", @@ -56589,15 +63376,15 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@usedFirstOptionSymbol@12029", + "name": "__@usedFirstOptionSymbol@17470", "value": "boolean", - "description": "A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n\nThis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.", + "description": "used to determine if no value or defaultValue was set, in which case the first non-disabled option was used\n\nthis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@hasInitialValueSymbol@12030", + "name": "__@hasInitialValueSymbol@17471", "value": "boolean", "description": "", "isPrivate": true @@ -56607,7 +63394,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -56615,23 +63402,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -56661,7 +63455,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -56669,33 +63463,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Select extends PreactInputElement implements SelectProps {\n accessor icon: SelectProps['icon'];\n accessor details: SelectProps['details'];\n accessor error: SelectProps['error'];\n accessor label: SelectProps['label'];\n accessor placeholder: SelectProps['placeholder'];\n accessor required: SelectProps['required'];\n accessor labelAccessibilityVisibility: SelectProps['labelAccessibilityVisibility'];\n /** @private */\n connectedCallback(): void;\n /**\n * A lifecycle callback that fires when the component is removed from the DOM. Performs cleanup operations.\n * @private\n */\n disconnectedCallback(): void;\n constructor();\n /**\n * A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n *\n * This is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.\n * @private\n */\n [usedFirstOptionSymbol]: boolean;\n /**\n * @private\n */\n [hasInitialValueSymbol]: boolean;\n /**\n * The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component.\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n}" + "value": "declare class Select extends SelectBase implements SelectProps {\n constructor();\n}" }, "Spinner": { "filePath": "src/surfaces/admin/components.ts", "name": "Spinner", - "description": "Configure the following properties on the spinner component.", - "isPublicDocs": true, + "description": "A component that displays an animated loading indicator to show that content is currently being processed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the spinner for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the loading spinner.\n\n- `base`: Default size suitable for inline loading indicators or standard UI contexts.\n- `large`: Larger spinner for more prominent loading states.\n- `large-100`: Extra large spinner for full-page or emphasized loading states.", + "description": "The size of the spinner.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -56741,7 +63556,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -56749,24 +63564,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Spinner extends PreactCustomElement implements SpinnerProps {\n accessor accessibilityLabel: string;\n accessor size: SpinnerProps['size'];\n constructor();\n}" + "value": "declare class Spinner extends PolarisCustomElement implements SpinnerProps {\n /**\n * A label that describes the spinner for assistive technologies.\n */\n accessibilityLabel: string;\n /**\n * The size of the spinner.\n */\n size: SpinnerProps['size'];\n constructor();\n}" }, "Stack": { "filePath": "src/surfaces/admin/components.ts", "name": "Stack", - "description": "Configure the following properties on the stack component.", - "isPublicDocs": true, + "description": "A stack is a layout component that arranges its children in a single direction with controlled spacing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "direction", "value": "MaybeResponsive<\"inline\" | \"block\">", - "description": "The direction in which the stack's children are placed within the stack.\n\nAccepts:\n- A single value, either `inline` or `block`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported direction values as a query value", + "description": "The direction in which the stack's children are arranged.", "defaultValue": "'block'" }, { @@ -56774,7 +63603,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "JustifyContentKeyword", - "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -56782,7 +63611,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "AlignItemsKeyword", - "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -56790,7 +63619,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "AlignContentKeyword", - "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.", "defaultValue": "'normal'" }, { @@ -56798,7 +63627,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between the stack's children.", "defaultValue": "'none'" }, { @@ -56806,7 +63635,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between rows in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -56814,7 +63643,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between columns in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -56822,7 +63651,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -56830,7 +63659,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -56838,7 +63667,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -56846,7 +63675,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -56854,7 +63683,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -56862,7 +63691,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -56870,7 +63699,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -56878,7 +63707,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -56886,7 +63715,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -56894,7 +63723,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -56902,7 +63731,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -56910,7 +63739,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -56918,7 +63747,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -56926,7 +63755,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -56934,7 +63763,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -56942,7 +63771,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -56950,7 +63779,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -56970,7 +63799,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -56978,7 +63807,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -56986,7 +63815,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -56994,7 +63823,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -57002,14 +63831,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -57017,9 +63846,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -57065,7 +63901,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -57073,32 +63909,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n accessor direction: StackProps['direction'];\n accessor justifyContent: StackProps['justifyContent'];\n accessor alignItems: StackProps['alignItems'];\n accessor alignContent: StackProps['alignContent'];\n accessor gap: StackProps['gap'];\n accessor rowGap: StackProps['rowGap'];\n accessor columnGap: StackProps['columnGap'];\n}" + "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n /**\n * The direction in which the stack's children are arranged.\n */\n direction: StackProps['direction'];\n /**\n * Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n */\n justifyContent: StackProps['justifyContent'];\n /**\n * Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n */\n alignItems: StackProps['alignItems'];\n /**\n * Controls the distribution of lines along the block axis when content wraps into multiple lines.\n */\n alignContent: StackProps['alignContent'];\n /**\n * The spacing between the stack's children.\n */\n gap: StackProps['gap'];\n /**\n * The spacing between rows in the stack.\n */\n rowGap: StackProps['rowGap'];\n /**\n * The spacing between columns in the stack.\n */\n columnGap: StackProps['columnGap'];\n}" }, "Switch": { "filePath": "src/surfaces/admin/components.ts", "name": "Switch", - "description": "Configure the following properties on the switch component.", - "isPublicDocs": true, + "description": "A switch that lets users toggle a setting on or off with a sliding control.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -57113,7 +63970,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -57121,28 +63978,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -57165,7 +64022,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -57173,23 +64030,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -57235,7 +64099,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -57243,24 +64107,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Switch extends PreactCheckboxElement implements SwitchProps {\n accessor labelAccessibilityVisibility: SwitchProps['labelAccessibilityVisibility'];\n constructor();\n}" + "value": "declare class Switch extends SwitchBase implements SwitchProps {\n constructor();\n}" }, "Table": { "filePath": "src/surfaces/admin/components.ts", "name": "Table", - "description": "Configure the following properties on the table component.", - "isPublicDocs": true, + "description": "A component that displays data in a structured table format that automatically adapts to the available space.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "variant", "value": "\"auto\" | \"list\"", - "description": "The layout variant of the table component.\n\n- `list`: Always displays as a list layout.\n- `table`: Always displays as a traditional table layout.\n- `auto`: Automatically displays as a table on wide screens and as a list on narrow screens.", + "description": "The display variant of the table.", "defaultValue": "'auto'" }, { @@ -57268,7 +64146,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table. When `true`, the table might be in an inert state that prevents user interaction.", + "description": "Whether the table is currently in a loading state.", "defaultValue": "false" }, { @@ -57276,7 +64154,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paginate", "value": "boolean", - "description": "Whether to use pagination controls.", + "description": "Whether the pagination controls are displayed.", "defaultValue": "false" }, { @@ -57284,7 +64162,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hasPreviousPage", "value": "boolean", - "description": "Whether there's a previous page of data.", + "description": "Whether there's a previous page of data that the user can navigate to.", "defaultValue": "false" }, { @@ -57292,25 +64170,40 @@ "syntaxKind": "PropertyDeclaration", "name": "hasNextPage", "value": "boolean", - "description": "Whether there's an additional page of data.", + "description": "Whether there's a next page of data that the user can navigate to.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@actualTableVariantSymbol@12105", - "value": "AddedContext", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@actualTableVariantSymbol@17550", + "value": "_shopify_admin_web_component_foundations.AddedContext", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@tableHeadersSharedDataSymbol@12106", - "value": "AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", + "name": "__@tableHeadersSharedDataSymbol@17551", + "value": "_shopify_admin_web_component_foundations.AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -57356,7 +64249,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -57364,78 +64257,69 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Table extends PreactCustomElement implements TableProps {\n accessor variant: TableProps['variant'];\n accessor loading: TableProps['loading'];\n accessor paginate: TableProps['paginate'];\n accessor hasPreviousPage: TableProps['hasPreviousPage'];\n accessor hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" - }, - "AddedContext": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AddedContext", - "description": "", - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "T", - "description": "The current context value.\n\nThe new context value to set, which will notify all consumers." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "addEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", - "description": "The **`addEventListener()`** method of the EventTarget interface sets up a function that will be called whenever the specified event is delivered to the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener)" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "dispatchEvent", - "value": "(event: Event) => boolean", - "description": "The **`dispatchEvent()`** method of the EventTarget sends an Event to the object, (synchronously) invoking the affected event listeners in the appropriate order.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/dispatchEvent)" + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "removeEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", - "description": "The **`removeEventListener()`** method of the EventTarget interface removes an event listener previously registered with EventTarget.addEventListener() from the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/removeEventListener)" + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AddedContext extends EventTarget {\n constructor(defaultValue: T);\n /**\n * The current context value.\n */\n get value(): T;\n /**\n * The new context value to set, which will notify all consumers.\n */\n set value(value: T);\n}" + "value": "declare class Table extends PolarisCustomElement implements TableProps {\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The display variant of the table.\n */\n variant: TableProps['variant'];\n /**\n * Whether the table is currently in a loading state.\n */\n loading: TableProps['loading'];\n /**\n * Whether the pagination controls are displayed.\n */\n paginate: TableProps['paginate'];\n /**\n * Whether there's a previous page of data that the user can navigate to.\n */\n hasPreviousPage: TableProps['hasPreviousPage'];\n /**\n * Whether there's a next page of data that the user can navigate to.\n */\n hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: _shopify_admin_web_component_foundations.AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: _shopify_admin_web_component_foundations.AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" }, "ActualTableVariant": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ActualTableVariant", "value": "'table' | 'list'", - "description": "Represents the actual rendered variant of a table component.\n- `table`: Displays as a traditional table layout.\n- `list`: Displays as a list layout.", - "isPublicDocs": true + "description": "" }, "ListSlotType": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ListSlotType", "value": "'primary' | 'secondary' | 'kicker' | 'inline' | 'labeled'", - "description": "Represents the semantic type of content slots within list items.\n\n- `primary`: The main content or title of the list item.\n- `secondary`: Supporting or descriptive content below the primary content.\n- `kicker`: A small label or tag displayed above the primary content.\n- `inline`: Content displayed inline with the primary content.\n- `labeled`: Content with an associated label.", - "isPublicDocs": true + "description": "" }, "HeaderFormat": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true }, "TableBody": { "filePath": "src/surfaces/admin/components.ts", "name": "TableBody", - "description": "The table body component represents the main content area of a table, containing the data rows. Use table body as a child of table to structure your table data, with each table row within the body representing a single record or entry.\n\nTable body must contain table row components, which in turn contain table cell components for the actual data values.", - "isPublicDocs": true, + "description": "A component that wraps the body content of a table, which contains the data rows.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -57481,7 +64365,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -57489,26 +64373,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableBody extends PreactCustomElement implements TableBodyProps {\n constructor();\n}" + "value": "declare class TableBody extends PolarisCustomElement implements TableBodyProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n}" }, "TableCell": { "filePath": "src/surfaces/admin/components.ts", "name": "TableCell", - "description": "The table cell component represents a single data cell within a table row. Use table cell as a child of table row to display individual data values, with each cell corresponding to a column in the table.\n\nTable cell automatically inherits styling and alignment from its parent table structure and supports text content or other inline components.", - "isPublicDocs": true, + "description": "A component that represents a single cell in a table row, which displays data in a format that's determined by its column header.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", - "name": "__@headerFormatSymbol@12128", + "name": "__@headerFormatSymbol@17578", "value": "HeaderFormat", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -57554,7 +64467,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -57562,24 +64475,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableCell extends PreactCustomElement implements TableCellProps {\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" + "value": "declare class TableCell extends PolarisCustomElement implements TableCellProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" }, "TableHeader": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeader", - "description": "The table header component represents a single column header within a table header row. Use table header as a child of table header row to define column headings and optionally enable column sorting.\n\nTable header provides semantic meaning for screen readers and can include sorting controls when configured. Each header corresponds to a column in the table body.", - "isPublicDocs": true, + "description": "A component that defines a column header in a table, which specifies both the header label and how the column's data should be formatted.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "listSlot", "value": "ListSlotType", - "description": "The content designation for this column when the table displays in list variant on mobile devices.", + "description": "The slot where this header's data appears when the table is shown in list view.", "defaultValue": "'labeled'" }, { @@ -57587,7 +64514,22 @@ "syntaxKind": "PropertyDeclaration", "name": "format", "value": "HeaderFormat", - "description": "The format of the column that controls styling and alignment of cell content." + "description": "The format of the header and its corresponding cells." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -57634,7 +64576,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -57642,17 +64584,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeader\n extends PreactCustomElement\n implements TableHeaderProps\n{\n accessor listSlot: TableHeaderProps['listSlot'];\n accessor format: TableHeaderProps['format'];\n constructor();\n}" + "value": "declare class TableHeader\n extends PolarisCustomElement\n implements TableHeaderProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The slot where this header's data appears when the table is shown in list view.\n */\n listSlot: TableHeaderProps['listSlot'];\n /**\n * The format of the header and its corresponding cells.\n */\n format: TableHeaderProps['format'];\n constructor();\n}" }, "TableHeaderRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeaderRow", - "description": "The table header row component represents the header row of a table, containing column headings. Use table header row as the first child of table (before table body) to define the table structure and provide column labels.\n\nTable header row must contain table header components for each column. These headers provide context for the data columns and can support sorting functionality.", - "isPublicDocs": true, + "description": "A component that wraps the header row of a table, which contains the table header components that define the column structure.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -57670,6 +64626,21 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -57699,7 +64670,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -57707,24 +64678,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeaderRow\n extends PreactCustomElement\n implements TableHeaderRowProps\n{\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class TableHeaderRow\n extends PolarisCustomElement\n implements TableHeaderRowProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "TableRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableRow", - "description": "The table row component represents a single row of data within a table body. Use table row as a child of table body to structure individual records or entries in the table.\n\nTable row must contain table cell components, with each cell representing a data value for the corresponding column. The number of cells should match the number of headers in the table.", - "isPublicDocs": true, + "description": "A component that represents a single row in a table, which contains the data cells.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "clickDelegate", "value": "string", - "description": "The ID of an interactive element, such as `s-link`, in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally." + "description": "A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -57771,7 +64771,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -57779,41 +64779,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableRow extends PreactCustomElement implements TableRowProps {\n constructor();\n accessor clickDelegate: string;\n}" + "value": "declare class TableRow extends PolarisCustomElement implements TableRowProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /**\n * A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector.\n */\n clickDelegate: string;\n}" }, "Text": { "filePath": "src/surfaces/admin/components.ts", "name": "Text", - "description": "Configure the following properties on the text component.", - "isPublicDocs": true, + "description": "A custom element for displaying inline or small blocks of text with various visual styles and semantic meanings. Use Text to render short pieces of content with appropriate styling, emphasis, and color treatment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color of the text.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", @@ -57828,7 +64842,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -57836,7 +64850,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, { @@ -57844,7 +64858,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The ID of an element this text provides contextual information for." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -57891,7 +64912,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -57899,24 +64920,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Text extends PreactCustomElement implements TextProps {\n accessor fontVariantNumeric: TextProps['fontVariantNumeric'];\n accessor color: TextProps['color'];\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: TextProps['tone'];\n /**\n * The semantic type and styling treatment for the text content.\n *\n * - `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n * - `generic`: Standard text with no special semantic meaning or styling.\n * - `address`: Marks the text as contact information, such as a physical or email address.\n * - `redundant`: Indicates the text is redundant or duplicated information for screen reader context.\n */\n accessor type: TextProps['type'];\n accessor dir: TextProps['dir'];\n accessor accessibilityVisibility: TextProps['accessibilityVisibility'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Text extends TextBase implements TextProps {\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: TextProps['tone'];\n constructor();\n}" }, "TextArea": { "filePath": "src/surfaces/admin/components.ts", "name": "TextArea", - "description": "Configure the following properties on the text area component.", - "isPublicDocs": true, + "description": "The text area custom element class that renders a multi-line text input field in the Shopify admin interface. This component allows merchants to enter and edit longer text content with support for labels, validation, and length constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -57924,7 +64959,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, { @@ -57932,22 +64967,15 @@ "syntaxKind": "PropertyDeclaration", "name": "rows", "value": "number", - "description": "A number of visible text lines.", + "description": "The number of visible text lines for the field, controlling its initial height.", "defaultValue": "2" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -57955,35 +64983,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -57991,14 +65019,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -58006,7 +65034,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -58030,7 +65058,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -58054,7 +65082,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -58062,23 +65090,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -58116,7 +65158,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -58124,24 +65166,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextArea\n extends PreactFieldElement\n implements TextAreaProps\n{\n accessor maxLength: TextAreaProps['maxLength'];\n accessor minLength: TextAreaProps['minLength'];\n accessor rows: TextAreaProps['rows'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextArea extends TextAreaBase implements TextAreaProps {\n constructor();\n}" }, "TextField": { "filePath": "src/surfaces/admin/components.ts", "name": "TextField", - "description": "Configure the following properties on the text field component.", - "isPublicDocs": true, + "description": "The text field custom element class that renders a single-line text input field in the Shopify admin interface. This component allows merchants to enter and edit text with support for labels, validation, icons, and prefix/suffix content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\" | AnyString", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "value": "IconType | AnyString", + "description": "An icon to display at the start of the text field, providing visual context for the input. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", "defaultValue": "''" }, { @@ -58149,7 +65205,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the merchant can enter in the field. When this limit is reached, the field prevents further input.", "defaultValue": "Infinity" }, { @@ -58157,7 +65213,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation. The field will be considered invalid if the merchant enters fewer characters than this value.", "defaultValue": "0" }, { @@ -58165,7 +65221,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the merchant's input, such as a currency symbol (`$`) or protocol (`https://`).", "defaultValue": "''" }, { @@ -58173,22 +65229,15 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the merchant's input, such as a unit of measurement (`kg`, `%`) or domain (`.myshopify.com`).", "defaultValue": "''" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -58196,35 +65245,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -58232,14 +65281,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -58247,7 +65296,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -58271,7 +65320,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -58295,7 +65344,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -58303,23 +65352,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -58357,7 +65420,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -58365,41 +65428,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextField\n extends PreactFieldElement\n implements TextFieldProps\n{\n accessor icon: TextFieldProps['icon'];\n accessor maxLength: TextFieldProps['maxLength'];\n accessor minLength: TextFieldProps['minLength'];\n accessor prefix: TextFieldProps['prefix'];\n accessor suffix: TextFieldProps['suffix'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextField extends TextFieldBase implements TextFieldProps {\n constructor();\n}" }, "Thumbnail": { "filePath": "src/surfaces/admin/components.ts", "name": "Thumbnail", - "description": "Configure the following properties on the thumbnail component.", - "isPublicDocs": true, + "description": "A thumbnail displays a small preview image with configurable sizing.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display in the thumbnail." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the product thumbnail image.\n\n- `small-200`: Smallest thumbnail size, ideal for compact product lists or tables.\n- `small-100`: Very small thumbnail, suitable for dense layouts.\n- `small`: Small thumbnail for space-constrained contexts.\n- `base`: Default size that balances visibility and space efficiency.\n- `large`: Larger thumbnail for featured products or detailed views.\n- `large-100`: Extra large thumbnail for prominent product display.", + "description": "The size of the thumbnail.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -58445,7 +65529,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -58453,22 +65537,36 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Thumbnail extends PreactCustomElement implements ThumbnailProps {\n accessor src: ThumbnailProps['src'];\n accessor alt: ThumbnailProps['alt'];\n accessor size: ThumbnailProps['size'];\n constructor();\n}" + "value": "declare class Thumbnail extends PolarisCustomElement implements ThumbnailProps {\n /**\n * The URL of the image to display in the thumbnail.\n */\n src: ThumbnailProps['src'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ThumbnailProps['alt'];\n /**\n * The size of the thumbnail.\n */\n size: ThumbnailProps['size'];\n constructor();\n}" }, "Tooltip": { "filePath": "src/surfaces/admin/components.ts", "name": "Tooltip", - "description": "Configure the following properties on the tooltip component.", - "isPublicDocs": true, + "description": "A component that displays a small popup with explanatory text when the user hovers over or focuses on an element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -58476,7 +65574,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -58484,11 +65582,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -58534,7 +65639,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -58542,8 +65647,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Tooltip extends PreactOverlayElement implements TooltipProps {\n constructor();\n}" @@ -58551,9 +65671,15 @@ "UnorderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "UnorderedList", - "description": "Configure the following properties on the unordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a bulleted list of items where the order doesn't matter. Use unordered list when you have a collection of related items without a specific sequence, such as features, options, or bullet points.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -58599,7 +65725,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -58607,32 +65733,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class UnorderedList\n extends PreactCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" + "value": "declare class UnorderedList\n extends PolarisCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" }, "URLField": { "filePath": "src/surfaces/admin/components.ts", "name": "URLField", - "description": "Configure the following properties on the URL field component.", - "isPublicDocs": true, + "description": "The URL field custom element class that renders a URL input field in the Shopify admin interface. This component allows merchants to enter web addresses with automatic URL validation and appropriate mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | `section-${string} url` | `section-${string} photo` | `section-${string} impp` | `section-${string} home impp` | `section-${string} mobile impp` | `section-${string} fax impp` | `section-${string} pager impp` | \"shipping url\" | \"shipping photo\" | \"shipping impp\" | \"shipping home impp\" | \"shipping mobile impp\" | \"shipping fax impp\" | \"shipping pager impp\" | \"billing url\" | \"billing photo\" | \"billing impp\" | \"billing home impp\" | \"billing mobile impp\" | \"billing fax impp\" | \"billing pager impp\" | `section-${string} shipping url` | `section-${string} shipping photo` | `section-${string} shipping impp` | `section-${string} shipping home impp` | `section-${string} shipping mobile impp` | `section-${string} shipping fax impp` | `section-${string} shipping pager impp` | `section-${string} billing url` | `section-${string} billing photo` | `section-${string} billing impp` | `section-${string} billing home impp` | `section-${string} billing mobile impp` | `section-${string} billing fax impp` | `section-${string} billing pager impp` | URLAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint about the intended content of the field for browser autofill.", + "defaultValue": "'url'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the URL.", "defaultValue": "Infinity" }, { @@ -58640,50 +65780,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the URL.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -58691,14 +65824,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -58706,7 +65839,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -58730,7 +65863,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -58754,7 +65887,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -58762,23 +65895,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -58816,7 +65963,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -58824,41 +65971,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class URLField\n extends PreactFieldElement\n implements URLFieldProps\n{\n accessor autocomplete: URLFieldProps['autocomplete'];\n accessor maxLength: URLFieldProps['maxLength'];\n accessor minLength: URLFieldProps['minLength'];\n /**\n * The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class URLField extends URLFieldBase implements URLFieldProps {\n constructor();\n}" }, "URLAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "URLAutocompleteField", "value": "'url' | 'photo' | 'impp' | 'home impp' | 'mobile impp' | 'fax impp' | 'pager impp'", - "description": "Represents autocomplete values that are valid for URL input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for URL inputs.\n\nAvailable values:\n- `url` - General URL or web address\n- `photo` - URL to a photo or image\n- `impp` - Instant messaging protocol URL\n- `home impp` - Home instant messaging protocol URL\n- `mobile impp` - Mobile instant messaging protocol URL\n- `fax impp` - Fax instant messaging protocol URL\n- `pager impp` - Pager instant messaging protocol URL", - "isPublicDocs": true + "description": "" }, "AdminAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminAction", - "description": "Configure the following properties on the admin action component.", - "isPublicDocs": true, + "description": "The admin action custom element class that renders action controls in the Shopify admin interface. This component creates a standardized action area with a heading and slots for primary and secondary action buttons, used exclusively in admin action extensions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text to use as the Action modal's title. If not provided, the name of the extension will be used." + "description": "The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the action is in a loading state, such as during initial page load or when the action is being opened. When `true`, the action might be in an inert state that prevents user interaction.", + "description": "Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -58904,7 +66071,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -58912,11 +66079,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminAction\n extends PreactCustomElement\n implements AdminActionProps\n{\n /**\n * The text to use as the Action modal's title. If not provided, the name of the extension will be used.\n */\n heading: string;\n /**\n * Whether the action is in a loading state, such as during initial page load or when the action is being opened.\n * When `true`, the action might be in an inert state that prevents user interaction.\n */\n loading: boolean;\n constructor();\n}" + "value": "declare class AdminAction\n extends PolarisCustomElement\n implements AdminActionProps\n{\n /**\n * The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading.\n */\n heading: string;\n /**\n * Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.\n *\n * @default false\n */\n loading: boolean;\n constructor();\n}" }, "RunnableExtension": { "filePath": "src/extension.ts", @@ -59129,22 +66311,28 @@ "AdminBlock": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminBlock", - "description": "Configure the following properties on the admin block component.", - "isPublicDocs": true, + "description": "The admin block custom element class that renders a collapsible content block in the Shopify admin interface. This component organizes content into expandable sections with headings and provides a summary when collapsed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text displayed as the block's title in the header. If not provided, the extension name will be used." + "description": "The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "collapsedSummary", "value": "string", - "description": "The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated." + "description": "The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -59191,7 +66379,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -59199,18 +66387,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminBlock\n extends PreactCustomElement\n implements AdminBlockProps\n{\n /**\n * The text displayed as the block's title in the header. If not provided, the extension name will be used.\n */\n heading: string;\n /**\n * The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated.\n */\n collapsedSummary: string;\n constructor();\n}" + "value": "declare class AdminBlock\n extends PolarisCustomElement\n implements AdminBlockProps\n{\n /**\n * The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed.\n */\n heading: string;\n /**\n * The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed.\n */\n collapsedSummary: string;\n constructor();\n}" }, "Form": { "filePath": "src/surfaces/admin/components.ts", "name": "Form", - "description": "Configure the following properties on the form component.", - "isPublicDocs": true, + "description": "The form custom element class that renders a form container in the Shopify admin interface. This component manages form submission, validation, and reset behavior for collecting merchant input.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -59256,7 +66465,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -59264,11 +66473,114 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Form extends PolarisCustomElement implements FormProps {\n constructor();\n}" + }, + "IntentRenderApi": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderApi", + "description": "The `IntentRenderApi` object provides methods for extensions that render in response to an app intent. Access the intent data to determine what action the merchant requested and use `intents.response` to resolve the intent when complete.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "auth", + "value": "Auth", + "description": "Provides methods for authenticating calls to your app backend. Use the `idToken()` method to retrieve a signed JWT token that verifies the current user's identity for secure server-side operations." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "extension", + "value": "{ target: ExtensionTarget; }", + "description": "The identifier of the running extension target. Use this to determine which target your extension is rendering in and conditionally adjust functionality or UI based on the extension context." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "i18n", + "value": "I18n", + "description": "Utilities for translating content according to the current localization of the admin. Use these methods to provide translated strings that match the merchant's language preferences, ensuring your extension is accessible to a global audience." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "intents", + "value": "IntentRenderIntents", + "description": "Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "picker", + "value": "PickerApi", + "description": "Opens a custom selection dialog with your app-specific data. Use the [Picker API](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/picker-api) to define the picker's heading, items, headers, and selection behavior. Returns a Promise that resolves to a `Picker` object with a `selected` property for accessing the merchant's selection." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "query", + "value": "(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>", + "description": "Executes GraphQL queries against the [GraphQL Admin API](/docs/api/admin-graphql). Use this to fetch shop data, manage resources, or perform mutations. Queries are automatically authenticated with the current user's permissions. Optionally specify GraphQL variables and API version for your query." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "resourcePicker", + "value": "ResourcePickerApi", + "description": "Opens the [resource picker](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/resource-picker-api) modal for selecting products, variants, or collections. Returns the selected resources when the user confirms their selection, or undefined if they cancel." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "storage", + "value": "Storage", + "description": "Provides methods for persisting data in browser storage that is scoped to your extension. Use this to store user preferences, cache data, maintain state across sessions, or save temporary working data. Storage is persistent across page reloads and isolated per extension." + } + ], + "value": "export interface IntentRenderApi\n extends StandardRenderingExtensionApi {\n /**\n * Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow.\n */\n intents: IntentRenderIntents;\n}" + }, + "IntentRenderIntents": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderIntents", + "description": "The intents API available to intent render extensions. Unlike other targets where `response` is optional, intent render extensions always run inside an intent workflow so `response` is guaranteed.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled." } ], - "value": "declare class Form extends PreactCustomElement implements FormProps {\n constructor();\n}" + "value": "export interface IntentRenderIntents {\n /**\n * Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled.\n */\n response: IntentResponseApi;\n}" + }, + "FormExtensionComponents": { + "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "FormExtensionComponents", + "value": "StandardComponents | 'Form'", + "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." }, "StandardApi": { "filePath": "src/surfaces/admin/api/standard/standard.ts", @@ -59922,19 +67234,18 @@ "value": "FormExtensionComponents | 'FunctionSettings'", "description": "The components available for building function settings extensions. Includes all form components plus the function settings component required for function settings configuration." }, - "FormExtensionComponents": { - "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "FormExtensionComponents", - "value": "StandardComponents | 'Form'", - "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." - }, "FunctionSettings": { "filePath": "src/surfaces/admin/components.ts", "name": "FunctionSettings", - "description": "Configure the following properties on the function settings component.", - "isPublicDocs": true, + "description": "The function settings custom element class that renders a specialized form for configuring Shopify Function settings in the admin interface. This component manages function configuration submission, validation, and error handling.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -59980,7 +67291,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -59988,8 +67299,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class FunctionSettings\n extends PreactCustomElement\n implements FunctionSettingsProps\n{\n constructor();\n}" @@ -60004,15 +67330,21 @@ "AdminPrintAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminPrintAction", - "description": "Configure the following properties on the admin print action component.", - "isPublicDocs": true, + "description": "The admin print action custom element class that renders a print interface in the Shopify admin. This component enables merchants to print content from a specified source URL using the browser's print functionality.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The `src` URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs, and images are supported." + "description": "The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -60059,7 +67391,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -60067,11 +67399,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminPrintAction\n extends PreactCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The `src` URL of the preview and the document to print.\n * If not provided, the preview will show an empty state and the print button will be disabled.\n * HTML, PDFs, and images are supported.\n */\n src: string;\n constructor();\n}" + "value": "declare class AdminPrintAction\n extends PolarisCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action.\n */\n src: string;\n constructor();\n}" }, "ProductDetailsConfigurationApi": { "filePath": "src/surfaces/admin/api/product-configuration/product-details-configuration.ts", @@ -61212,32 +68559,31 @@ "Text": { "filePath": "src/surfaces/admin/components.ts", "name": "Text", - "description": "Configure the following properties on the text component.", - "isPublicDocs": true, + "description": "A custom element for displaying inline or small blocks of text with various visual styles and semantic meanings. Use Text to render short pieces of content with appropriate styling, emphasis, and color treatment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color of the text.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", @@ -61252,7 +68598,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -61260,7 +68606,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, { @@ -61268,7 +68614,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The ID of an element this text provides contextual information for." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -61315,7 +68668,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -61323,17 +68676,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Text extends PreactCustomElement implements TextProps {\n accessor fontVariantNumeric: TextProps['fontVariantNumeric'];\n accessor color: TextProps['color'];\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: TextProps['tone'];\n /**\n * The semantic type and styling treatment for the text content.\n *\n * - `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n * - `generic`: Standard text with no special semantic meaning or styling.\n * - `address`: Marks the text as contact information, such as a physical or email address.\n * - `redundant`: Indicates the text is redundant or duplicated information for screen reader context.\n */\n accessor type: TextProps['type'];\n accessor dir: TextProps['dir'];\n accessor accessibilityVisibility: TextProps['accessibilityVisibility'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Text extends TextBase implements TextProps {\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: TextProps['tone'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -61356,31 +68723,31 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred." + "description": "" } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" }, "ExtensionTarget": { "filePath": "src/surfaces/admin/extension-targets.ts", @@ -61416,6 +68783,13 @@ "value": "RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >", "description": "A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options." }, + { + "filePath": "src/surfaces/admin/extension-targets.ts", + "syntaxKind": "PropertySignature", + "name": "admin.app.intent.render", + "value": "RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >", + "description": "Renders an admin extension for handling app intents." + }, { "filePath": "src/surfaces/admin/extension-targets.ts", "syntaxKind": "PropertySignature", @@ -61943,7 +69317,7 @@ "description": "A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules." } ], - "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n}" + "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n\n /**\n * Renders an admin extension for handling app intents.\n */\n 'admin.app.intent.render': RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >;\n}" }, "RenderExtension": { "filePath": "src/extension.ts", @@ -62117,9 +69491,17 @@ "value": "string | URL", "description": "The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.", + "isOptional": true } ], - "value": "export interface Intents {\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" + "value": "export interface Intents {\n /**\n * Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.\n */\n response?: IntentResponseApi;\n\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" }, "IntentInvokeApi": { "filePath": "src/surfaces/admin/api/intents/intents.ts", @@ -62129,6 +69511,67 @@ "members": [], "value": "export interface IntentInvokeApi {\n (query: IntentQuery): Promise;\n (intentURL: string, options?: IntentQueryOptions): Promise;\n}" }, + "IntentResponseApi": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "IntentResponseApi", + "description": "The `IntentResponseApi` object provides methods for resolving the current intent from within an invoked extension. This API is only present when your extension is running inside an intent workflow.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "closed", + "value": "() => Promise", + "description": "Resolves the current intent as closed without completing the workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "error", + "value": "(message: string, issues?: Issue[]) => Promise", + "description": "Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "ok", + "value": "(data?: { [key: string]: unknown; }) => Promise", + "description": "Resolves the current intent successfully. Pass output data when your intent defines a response schema." + } + ], + "value": "export interface IntentResponseApi {\n /**\n * Resolves the current intent successfully. Pass output data when your intent defines a response schema.\n */\n ok(data?: SuccessIntentResponse['data']): Promise;\n\n /**\n * Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available.\n */\n error(message: string, issues?: Issue[]): Promise;\n\n /**\n * Resolves the current intent as closed without completing the workflow.\n */\n closed(): Promise;\n}" + }, + "Issue": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "Issue", + "description": "A structured issue describing a validation or workflow error.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "code", + "value": "string", + "description": "A machine-readable error code for this issue. Use this for programmatic error handling or logging.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "message", + "value": "string", + "description": "A description of what's wrong with this field. Display this to help merchants understand how to fix the error.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "path", + "value": "string[]", + "description": "The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure.", + "isOptional": true + } + ], + "value": "export interface Issue {\n /** The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure. */\n path?: string[];\n /** A description of what's wrong with this field. Display this to help merchants understand how to fix the error. */\n message?: string;\n /** A machine-readable error code for this issue. Use this for programmatic error handling or logging. */\n code?: string;\n}" + }, "PickerApi": { "filePath": "src/surfaces/admin/api/picker/picker.ts", "name": "PickerApi", @@ -62622,29 +70065,28 @@ "Avatar": { "filePath": "src/surfaces/admin/components.ts", "name": "Avatar", - "description": "Configure the following properties on the avatar component.", - "isPublicDocs": true, + "description": "An avatar displays a user or entity image with fallback initials when the image isn't available.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "initials", "value": "string", - "description": "The initials to display in the avatar when no image is provided or fails to load. Typically one or two characters representing a person's first and last name initials, such as \"JD\" for John Doe." + "description": "The initials to display when no image is provided or if the image fails to load." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The URL or path to the avatar image. When provided, the image takes priority over `initials`. If the image fails to load or loads slowly, `initials` will be rendered as a fallback." + "description": "The URL of the avatar image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"base\" | \"large\" | \"large-200\"", - "description": "The size of the avatar image.\n\n- `small-200`: Extra small avatar, suitable for compact displays or lists with many items.\n- `small`: Small avatar, good for secondary contexts or tight layouts.\n- `base`: Default size that works well in most contexts.\n- `large`: Large avatar for emphasis or when the avatar is a focal point.\n- `large-200`: Extra large avatar for prominent display.", + "description": "The size of the avatar.", "defaultValue": "'base'" }, { @@ -62652,7 +70094,14 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the avatar for accessibility.\n\nProvides a text description of the avatar for users with assistive technology and serves as a fallback when the avatar fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an avatar, it reads this description aloud. When an avatar fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt)." + "description": "Alternative text that describes the avatar for screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -62699,7 +70148,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -62707,48 +70156,70 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Avatar extends PreactCustomElement implements AvatarProps {\n accessor initials: AvatarProps['initials'];\n accessor src: AvatarProps['src'];\n accessor size: AvatarProps['size'];\n accessor alt: AvatarProps['alt'];\n constructor();\n}" + "value": "declare class Avatar extends PolarisCustomElement implements AvatarProps {\n /**\n * The initials to display when no image is provided or if the image fails to load.\n */\n initials: AvatarProps['initials'];\n /**\n * The URL of the avatar image to display.\n */\n src: AvatarProps['src'];\n /**\n * The size of the avatar.\n */\n size: AvatarProps['size'];\n /**\n * Alternative text that describes the avatar for screen readers.\n */\n alt: AvatarProps['alt'];\n constructor();\n}" }, "Badge": { "filePath": "src/surfaces/admin/components.ts", "name": "Badge", - "description": "Configure the following properties on the badge component.", - "isPublicDocs": true, + "description": "The badge custom element class that renders status indicators in the Shopify admin interface. This component displays compact visual indicators with customizable tones, sizes, and optional icons to communicate status information to merchants.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"strong\"", - "description": "Controls the visual weight and emphasis of the badge.\n\n- `base`: Standard weight with moderate emphasis, suitable for most use cases.\n- `strong`: Increased visual weight for higher emphasis and prominence.", - "defaultValue": "'base'" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the badge to provide additional visual context or reinforce the badge's meaning. Accepts any icon name from the icon library or a custom string identifier." + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"strong\"", + "description": "The visual weight of the badge. Available options: `'base'` for standard weight or `'strong'` for increased emphasis.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the badge.\n\n- `base`: Default size suitable for most badge use cases.\n- `large`: Larger badge for increased visibility and prominence.\n- `large-100`: Extra large badge for maximum visibility in emphasized contexts.", + "description": "The size of the badge. Available options: `'base'` for standard size, `'large'` for larger size, or `'large-100'` for extra large size.", "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", - "defaultValue": "'auto'" + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -62795,7 +70266,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -62803,17 +70274,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Badge extends PreactCustomElement implements BadgeProps {\n accessor color: BadgeProps['color'];\n accessor icon: BadgeProps['icon'];\n accessor size: BadgeProps['size'];\n accessor tone: BadgeProps['tone'];\n constructor();\n}" + "value": "declare class Badge extends BadgeBase implements BadgeProps {\n /**\n * The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: BadgeProps['icon'];\n /**\n * The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.\n */\n tone: BadgeProps['tone'];\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "Banner": { "filePath": "src/surfaces/admin/components.ts", "name": "Banner", - "description": "Configure the following properties on the banner component.", - "isPublicDocs": true, + "description": "A custom element for displaying important messages and notifications.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -62828,7 +70320,7 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.", + "description": "The color tone of the banner based on its semantic meaning.", "defaultValue": "'auto'" }, { @@ -62836,7 +70328,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Controls whether the banner is visible or hidden.\n\nWhen using a controlled component pattern and the banner is `dismissible`, update this property to `true` when the `dismiss` event fires.\n\nYou can hide the banner programmatically by setting this to `true` even if it's not `dismissible`.", + "description": "Whether the banner is hidden from view.", "defaultValue": "false" }, { @@ -62844,9 +70336,16 @@ "syntaxKind": "PropertyDeclaration", "name": "dismissible", "value": "boolean", - "description": "Whether the banner displays a close button that allows users to dismiss it.\n\nWhen the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, any animation completes, and the `afterhide` event fires.", + "description": "Whether the banner can be dismissed by the user.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -62892,7 +70391,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -62900,24 +70399,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Banner extends PreactCustomElement implements BannerProps {\n accessor heading: BannerProps['heading'];\n accessor tone: BannerProps['tone'];\n accessor hidden: BannerProps['hidden'];\n accessor dismissible: BannerProps['dismissible'];\n constructor();\n}" + "value": "declare class Banner extends PolarisCustomElement implements BannerProps {\n /**\n * The heading text displayed at the top of the banner.\n */\n heading: BannerProps['heading'];\n /**\n * The color tone of the banner based on its semantic meaning.\n */\n tone: BannerProps['tone'];\n /**\n * Whether the banner is hidden from view.\n */\n hidden: BannerProps['hidden'];\n /**\n * Whether the banner can be dismissed by the user.\n */\n dismissible: BannerProps['dismissible'];\n constructor();\n}" }, "Box": { "filePath": "src/surfaces/admin/components.ts", "name": "Box", - "description": "Configure the following properties on the box component.", - "isPublicDocs": true, + "description": "A box is a container component that provides control over layout, spacing, and styling.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -62925,7 +70438,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -62933,7 +70446,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -62941,7 +70454,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -62949,7 +70462,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -62957,7 +70470,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -62965,7 +70478,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -62973,7 +70486,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -62981,7 +70494,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -62989,7 +70502,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -62997,7 +70510,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -63005,7 +70518,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -63013,7 +70526,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -63021,7 +70534,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -63029,7 +70542,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -63037,7 +70550,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -63045,7 +70558,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -63065,7 +70578,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -63073,7 +70586,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -63081,7 +70594,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -63089,7 +70602,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -63097,14 +70610,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -63112,9 +70625,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -63160,7 +70680,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -63168,8 +70688,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Box extends BoxElement implements BoxProps {\n constructor();\n}" @@ -63178,120 +70713,106 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -63299,60 +70820,60 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "Button": { "filePath": "src/surfaces/admin/components.ts", "name": "Button", - "description": "Configure the following properties on the button component.", - "isPublicDocs": true, + "description": "The button custom element class that renders interactive buttons in the Shopify admin interface. This component triggers actions or navigation when clicked, with customizable visual styles, states, and optional icons.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", - "defaultValue": "false" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier." + "name": "variant", + "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", + "description": "The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.", + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "loading", - "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", - "defaultValue": "false" + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "variant", - "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "defaultValue": "'auto'" + "name": "disabled", + "value": "boolean", + "description": "Whether the button is disabled, preventing any interaction. When `true`, the button appears visually disabled and doesn't respond to user clicks.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" + "name": "loading", + "value": "boolean", + "description": "Whether the button is in a loading state. When `true`, displays a loading indicator and prevents interaction to show that an action is in progress.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to open the linked document when the button acts as a link. Available options: `''`, `'_blank'`, `'_self'`, `'_parent'`, or `'_top'`.", "defaultValue": "'auto'" }, { @@ -63360,21 +70881,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "A URL that the button should navigate to when clicked. When provided, the button behaves as a link." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Prompts the user to save the linked URL as a file with the specified filename. Only works when `href` is provided." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The button's behavior in forms. Available options: `'button'`, `'submit'`, or `'reset'`.", "defaultValue": "'button'" }, { @@ -63382,117 +70903,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", - "defaultValue": "'--auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "A text description of the button's purpose for screen readers. This is essential for accessibility when the button doesn't have visible text." }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." - } - ], - "value": "declare class Button extends Button_base implements ButtonProps {\n accessor disabled: ButtonProps['disabled'];\n accessor icon: ButtonProps['icon'];\n accessor loading: ButtonProps['loading'];\n accessor variant: ButtonProps['variant'];\n accessor tone: ButtonProps['tone'];\n accessor target: ButtonProps['target'];\n accessor href: ButtonProps['href'];\n accessor download: ButtonProps['download'];\n accessor type: ButtonProps['type'];\n accessor accessibilityLabel: ButtonProps['accessibilityLabel'];\n constructor();\n}" - }, - "AnyString": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "AnyString", - "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true - }, - "ButtonGroup": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ButtonGroup", - "description": "Configure the following properties on the button group component.", - "isPublicDocs": true, - "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "gap", - "value": "\"base\" | \"none\"", - "description": "The spacing between buttons in the group.\n\n- `base`: Standard spacing that provides clear visual separation between buttons.\n- `none`: No spacing, creating a connected button group.", - "defaultValue": "'base'" + "name": "inlineSize", + "value": "\"auto\" | \"fill\" | \"fit-content\"", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -63539,7 +70965,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -63547,39 +70973,197 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle'", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", + "defaultValue": "'--auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "commandFor", + "value": "string", + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", + "value": "string", + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class ButtonGroup\n extends PreactCustomElement\n implements ButtonGroupProps\n{\n accessor gap: ButtonGroupProps['gap'];\n accessor accessibilityLabel: ButtonGroupProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Button\n extends ButtonBase\n implements ButtonProps\n{\n /**\n * The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: ButtonProps['icon'];\n /**\n * The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.\n */\n variant: ButtonProps['variant'];\n /**\n * The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.\n */\n tone: ButtonProps['tone'];\n constructor();\n}" + }, + "AnyString": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "AnyString", + "value": "string & {}", + "description": "Prevents widening string literal types in a union to `string`." + }, + "ButtonGroup": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ButtonGroup", + "description": "A button group that arranges multiple buttons together with consistent spacing and semantic grouping for related actions.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "gap", + "value": "\"base\" | \"none\"", + "description": "The amount of spacing between buttons in the group, affecting the visual separation of actions.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that's only visible to screen readers, describing the purpose of this group of buttons." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class ButtonGroup extends ButtonGroupBase implements ButtonGroupProps {\n constructor();\n}" }, "Checkbox": { "filePath": "src/surfaces/admin/components.ts", "name": "Checkbox", - "description": "Configure the following properties on the checkbox component.", - "isPublicDocs": true, + "description": "A checkbox that lets users select or deselect an option, with support for an indeterminate state.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "indeterminate", "value": "boolean", - "description": "Whether the checkbox displays in an indeterminate state (neither checked nor unchecked), typically used to indicate partial selection in hierarchical lists.\n\nThis visual state takes priority over the `checked` prop in appearance only. The form submission value is still determined by the `checked` prop.\n\nIf `indeterminate` has not been explicitly set and hasn't been modified by user interaction, it returns the value of `defaultIndeterminate`." + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultIndeterminate", "value": "boolean", - "description": "The initial indeterminate state for uncontrolled components. Use this when you want the checkbox to start in an indeterminate state but don't need to control it afterward.\n\nThis value applies until `indeterminate` is explicitly set or the user changes the checkbox state by clicking.", + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "labelAccessibilityVisibility", + "value": "\"visible\" | \"exclusive\"", + "description": "", + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -63594,7 +71178,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -63602,28 +71186,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -63646,7 +71230,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -63654,23 +71238,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -63716,7 +71307,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -63724,24 +71315,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Checkbox extends PreactCheckboxElement implements CheckboxProps {\n get indeterminate(): CheckboxProps['indeterminate'];\n set indeterminate(indeterminate: CheckboxProps['indeterminate']);\n accessor defaultIndeterminate: CheckboxProps['defaultIndeterminate'];\n constructor();\n}" + "value": "declare class Checkbox extends CheckboxBase implements CheckboxProps {\n constructor();\n}" + }, + "CallbackEvent": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CallbackEvent", + "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." }, "Chip": { "filePath": "src/surfaces/admin/components.ts", "name": "Chip", - "description": "Configure the following properties on the chip component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "Modify the color to be more or less intense.", "defaultValue": "'base'" }, { @@ -63749,7 +71361,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -63796,7 +71423,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -63804,24 +71431,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Chip extends PreactCustomElement implements ChipProps {\n accessor color: ChipProps['color'];\n accessor accessibilityLabel: ChipProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Chip extends PolarisCustomElement implements ChipProps {\n color: ChipProps['color'];\n accessibilityLabel: ChipProps['accessibilityLabel'];\n removable: ChipProps['removable'];\n constructor(renderImpl?: Omit);\n}" }, "Choice": { "filePath": "src/surfaces/admin/components.ts", "name": "Choice", - "description": "The choice component creates individual selectable options within a choice list. Use choice to define each option that merchants can select, supporting both single selection (radio buttons) and multiple selection (checkboxes) modes.\n\nChoice components support labels, help text, and custom content through slots, providing flexible option presentation within choice lists.", - "isPublicDocs": true, + "description": "A single choice within a choice list that can be selected with a radio button or checkbox.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the choice is disabled and can't be selected.", "defaultValue": "false" }, { @@ -63829,7 +71470,7 @@ "syntaxKind": "GetAccessor", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the choice is currently selected.", "defaultValue": "false" }, { @@ -63837,21 +71478,21 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this choice is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, used when the visual label isn't descriptive enough." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the choice should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -63870,6 +71511,13 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -63899,7 +71547,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -63907,24 +71555,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Choice extends PreactCustomElement implements ChoiceProps {\n accessor disabled: ChoiceProps['disabled'];\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n accessor value: ChoiceProps['value'];\n accessor accessibilityLabel: ChoiceProps['accessibilityLabel'];\n accessor defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Choice extends PolarisCustomElement implements ChoiceProps {\n /**\n * Whether the choice is disabled and can't be selected.\n */\n disabled: ChoiceProps['disabled'];\n /**\n * Whether the choice is currently selected.\n */\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n /**\n * The value that's submitted with the form when this choice is selected.\n */\n value: ChoiceProps['value'];\n /**\n * A label that's only visible to screen readers, used when the visual label isn't descriptive enough.\n */\n accessibilityLabel: ChoiceProps['accessibilityLabel'];\n /**\n * Whether the choice should be selected when it's first rendered.\n */\n defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ChoiceList": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceList", - "description": "Configure the following properties on the choice list component.", - "isPublicDocs": true, + "description": "A list of choices that lets users select one or more options using radio buttons or checkboxes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "addEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", + "description": "Wraps change and input event listeners so they only fire when the event was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n\nThis prevents form events from elements inside secondary content (e.g. TextField, native ) from being mistakenly treated as ChoiceList value-change events, while still allowing those events to bubble normally through the DOM (preserving React's event delegation).", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "removeEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction. When `true`, the `disabled` property on any child choices is ignored.", + "description": "Whether all choices in the list are disabled and can't be selected.", "defaultValue": "false" }, { @@ -63932,43 +71610,43 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name that identifies this choice list when the form is submitted." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the choice list when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the choice list." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "multiple", "value": "boolean", - "description": "Whether multiple choices can be selected.", + "description": "Whether users can select more than one choice at a time.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the choice list is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -63976,7 +71654,7 @@ "syntaxKind": "GetAccessor", "name": "values", "value": "string[]", - "description": "An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected." + "description": "The values of the currently selected choices." }, { "filePath": "src/surfaces/admin/components.ts", @@ -64005,11 +71683,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$3@11434", + "name": "__@internals$3@16769", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -64039,7 +71724,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -64047,38 +71732,52 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ChoiceList extends BaseClass$3 implements ChoiceListProps {\n accessor disabled: ChoiceListProps['disabled'];\n accessor name: ChoiceListProps['name'];\n accessor error: ChoiceListProps['error'];\n accessor details: ChoiceListProps['details'];\n accessor multiple: ChoiceListProps['multiple'];\n accessor label: ChoiceListProps['label'];\n accessor labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class ChoiceList extends BaseClass$1 implements ChoiceListProps {\n /**\n * Wraps change and input event listeners so they only fire when the event\n * was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n *\n * This prevents form events from elements inside secondary content (e.g.\n * TextField, native ) from being mistakenly treated as ChoiceList\n * value-change events, while still allowing those events to bubble normally\n * through the DOM (preserving React's event delegation).\n * @private\n */\n addEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n\n /** @private */\n removeEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: EventListenerOptions | boolean,\n ): void;\n\n /**\n * Whether all choices in the list are disabled and can't be selected.\n */\n disabled: ChoiceListProps['disabled'];\n /**\n * The name that identifies this choice list when the form is submitted.\n */\n name: ChoiceListProps['name'];\n /**\n * An error message that's displayed below the choice list when validation fails.\n */\n error: ChoiceListProps['error'];\n /**\n * Additional text to provide context or guidance for the choice list.\n */\n details: ChoiceListProps['details'];\n /**\n * Whether users can select more than one choice at a time.\n */\n multiple: ChoiceListProps['multiple'];\n /**\n * The text that describes what the choice list is for.\n */\n label: ChoiceListProps['label'];\n /**\n * Controls whether the label is visible to all users or only to screen readers.\n */\n labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n /**\n * The values of the currently selected choices.\n */\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "Clickable": { "filePath": "src/surfaces/admin/components.ts", "name": "Clickable", - "description": "Configure the following properties on the clickable component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the component is disabled, preventing clicks and focus. When disabled, the `click` event won't fire and click events from child elements stop propagating immediately. Interactive child elements can still receive focus and be interacted with. This doesn't apply visual styling by default. You shouldapply disabled styling as needed." + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the component is in a loading state, which indicates to assistive technology that an action is in progress and prevents interaction." + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -64086,21 +71785,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "defaultValue": "'button'" }, { @@ -64108,7 +71807,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -64116,7 +71815,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -64124,7 +71823,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -64132,7 +71831,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -64140,7 +71839,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -64148,7 +71847,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -64156,7 +71855,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -64164,7 +71863,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -64172,7 +71871,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -64180,7 +71879,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -64188,7 +71887,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -64196,7 +71895,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -64204,7 +71903,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -64212,7 +71911,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -64220,7 +71919,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -64228,7 +71927,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -64236,7 +71935,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -64256,7 +71955,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -64264,7 +71963,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -64272,7 +71971,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -64280,7 +71979,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -64288,14 +71987,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -64303,9 +72002,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -64351,7 +72057,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -64359,15 +72065,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -64375,30 +72096,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n accessor disabled: ClickableProps['disabled'];\n accessor loading: ClickableProps['loading'];\n accessor target: ClickableProps['target'];\n accessor href: ClickableProps['href'];\n accessor download: ClickableProps['download'];\n accessor type: ClickableProps['type'];\n constructor();\n}" + "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n disabled: ClickableProps['disabled'];\n loading: ClickableProps['loading'];\n target: ClickableProps['target'];\n href: ClickableProps['href'];\n download: ClickableProps['download'];\n type: ClickableProps['type'];\n constructor();\n}" }, "ClickableChip": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChip", - "description": "Configure the following properties on the clickable chip component.", - "isPublicDocs": true, + "description": "A custom element for displaying interactive chips that can be clicked or removed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "The color of the chip.", "defaultValue": "'base'" }, { @@ -64406,14 +72126,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the chip for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "removable", "value": "boolean", - "description": "Whether the chip displays a remove button for dismissal. When clicked, the `remove` callback fires.", + "description": "Whether the chip can be removed by the user.", "defaultValue": "false" }, { @@ -64421,7 +72141,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Whether the chip is hidden from view. When using controlled component pattern with `removable` chips, update this property when the `remove` event fires. For non-removable chips, manually toggle this property to show or hide the chip.", + "description": "Whether the chip is hidden from view.", "defaultValue": "false" }, { @@ -64429,7 +72149,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the chip is disabled, preventing any user interaction.", + "description": "Whether the chip is disabled and can't be clicked.", "defaultValue": "false" }, { @@ -64437,7 +72157,14 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to navigate to when the chip is clicked." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -64484,7 +72211,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -64492,15 +72219,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -64508,30 +72250,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class ClickableChip\n extends ClickableChip_base\n implements ClickableChipProps\n{\n accessor color: ClickableChipProps['color'];\n accessor accessibilityLabel: ClickableChipProps['accessibilityLabel'];\n accessor removable: ClickableChipProps['removable'];\n accessor hidden: ClickableChipProps['hidden'];\n accessor disabled: ClickableChipProps['disabled'];\n accessor href: ClickableChipProps['href'];\n constructor();\n}" + "value": "declare class ClickableChip\n extends ClickableChipBase\n implements ClickableChipProps\n{\n /**\n * The color of the chip.\n */\n color: ClickableChipProps['color'];\n constructor();\n}" }, "ColorField": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorField", - "description": "Configure the following properties on the color field component.", - "isPublicDocs": true, + "description": "The color field custom element class that renders a color input field with integrated visual picker in the Shopify admin interface. This component allows merchants to select colors by typing hex values or using an interactive color picker, with optional support for transparency (alpha channel).", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -64539,7 +72280,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", @@ -64562,7 +72303,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\"", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -64570,35 +72311,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -64606,14 +72347,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -64621,7 +72362,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -64645,7 +72386,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -64661,7 +72402,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -64669,23 +72410,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -64723,7 +72471,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -64731,24 +72479,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ColorField\n extends PreactFieldElement\n implements ColorFieldProps\n{\n accessor alpha: ColorFieldProps['alpha'];\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n setInternalValue(value: string, normalize: boolean): void;\n}" + "value": "declare class ColorField extends ColorFieldBase implements ColorFieldProps {\n constructor();\n}" }, "ColorPicker": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorPicker", - "description": "Configure the following properties on the color picker component.", - "isPublicDocs": true, + "description": "A visual color picker component that allows users to select colors from a color spectrum interface.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -64756,154 +72518,138 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial color value when the field first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts interacting, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", "name": "formResetCallback", "value": "() => void", - "description": "A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@internals$2@11535", - "value": "ElementInternals", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", "description": "", "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true } ], - "value": "declare class ColorPicker extends BaseClass$2 implements ColorPickerProps {\n accessor alpha: boolean;\n accessor name: string;\n accessor defaultValue: string;\n get value(): string;\n set value(value: string);\n /**\n * A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`.\n */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class ColorPicker extends BaseClass implements ColorPickerProps {\n /**\n * Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.\n *\n * @default false\n */\n alpha: boolean;\n /**\n * The name of the picker, used when submitting form data.\n */\n name: string;\n /**\n * The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n defaultValue: string;\n /**\n * The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n}" }, "DateField": { "filePath": "src/surfaces/admin/components.ts", "name": "DateField", - "description": "Configure the following properties on the date field component.", - "isPublicDocs": true, + "description": "The date field custom element class that renders a date input field with integrated calendar picker in the Shopify admin interface. This component allows merchants to select dates by typing or using a visual calendar, with support for date range restrictions and day-of-week constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar picker, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar picker first opens, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "DateAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -64911,36 +72657,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "defaultValue": "\"\"" + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -64948,14 +72693,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -64963,7 +72708,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -64987,7 +72732,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -65011,7 +72756,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -65019,31 +72764,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected date in `YYYY-MM-DD` format. An empty string means no date is selected.", - "defaultValue": "\"\"" + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -65081,7 +72832,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -65089,78 +72840,139 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DateField\n extends PreactFieldElement\n implements DateFieldProps\n{\n accessor allow: DateFieldProps['allow'];\n accessor disallow: DateFieldProps['disallow'];\n accessor allowDays: DateFieldProps['allowDays'];\n accessor disallowDays: DateFieldProps['disallowDays'];\n set view(view: string);\n get view(): string;\n accessor defaultView: DateFieldProps['defaultView'];\n constructor();\n}" + "value": "declare class DateField extends DateFieldBase implements DateFieldProps {\n constructor();\n}" }, "DateAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "DateAutocompleteField", "value": "'bday-day' | 'bday-month' | 'bday-year' | 'bday' | 'cc-expiry-month' | 'cc-expiry-year' | 'cc-expiry'", - "description": "Represents autocomplete values that are valid for date input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for date-based inputs.\n\nAvailable values:\n- `bday` - Complete birthday date\n- `bday-day` - Day component of a birthday (1-31)\n- `bday-month` - Month component of a birthday (1-12)\n- `bday-year` - Year component of a birthday (1990)\n- `cc-expiry` - Complete credit card expiration date\n- `cc-expiry-month` - Month component of a credit card expiration date (1-12)\n- `cc-expiry-year` - Year component of a credit card expiration date (2025)", - "isPublicDocs": true + "description": "" }, "DatePicker": { "filePath": "src/surfaces/admin/components.ts", "name": "DatePicker", - "description": "Configure the following properties on the date picker component.", - "isPublicDocs": true, + "description": "The date picker custom element class that renders a standalone calendar interface in the Shopify admin. This component allows merchants to select single dates or date ranges using an interactive calendar with month/year navigation, date constraints, and day-of-week restrictions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar first renders, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"single\" | \"range\"", - "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "description": "The type of date selection allowed. Available values: `single`, `range`.", "defaultValue": "\"single\"" }, { @@ -65168,7 +72980,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initially selected date(s) when the component first renders. An empty string means no date is initially selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The initial selected date or date range when the picker first renders, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -65176,14 +72988,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "value", "value": "string", - "description": "The currently selected date(s). An empty string means no date is selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The currently selected date or date range, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -65197,19 +73009,26 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@dirtyStateSymbol@11579", - "value": "boolean", + "name": "__@internals$1@16931", + "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$1@11578", - "value": "ElementInternals", + "name": "__@dirtyStateSymbol@16932", + "value": "boolean", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -65255,7 +73074,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -65263,17 +73082,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DatePicker extends BaseClass$1 implements DatePickerProps {\n accessor defaultView: string;\n set view(view: string);\n get view(): string;\n accessor allow: DatePickerProps['allow'];\n accessor disallow: DatePickerProps['disallow'];\n accessor allowDays: DatePickerProps['allowDays'];\n accessor disallowDays: DatePickerProps['disallowDays'];\n accessor type: DatePickerProps['type'];\n accessor defaultValue: DatePickerProps['defaultValue'];\n accessor name: DatePickerProps['name'];\n set value(value: string);\n get value(): string;\n /** @private */\n [dirtyStateSymbol]: boolean;\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DatePicker\n extends DatePickerBase\n implements DatePickerProps\n{\n constructor();\n}" }, "DropZone": { "filePath": "src/surfaces/admin/components.ts", "name": "DropZone", - "description": "Configure the following properties on the drop zone component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -65295,29 +73128,29 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -65333,14 +73166,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -65370,7 +73203,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@setFiles@11614", + "name": "__@setFiles@16968", "value": "(files: File[]) => void", "description": "", "isPrivate": true @@ -65378,7 +73211,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@getFileInput@11616", + "name": "__@getFileInput@16970", "value": "() => HTMLInputElement", "description": "", "isPrivate": true @@ -65386,11 +73219,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals@11615", + "name": "__@internals@16969", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -65436,7 +73276,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -65444,17 +73284,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DropZone extends BaseClass implements DropZoneProps {\n accessor accept: DropZoneProps['accept'];\n accessor accessibilityLabel: DropZoneProps['accessibilityLabel'];\n accessor disabled: DropZoneProps['disabled'];\n accessor error: DropZoneProps['error'];\n accessor label: DropZoneProps['label'];\n accessor labelAccessibilityVisibility: DropZoneProps['labelAccessibilityVisibility'];\n accessor multiple: DropZoneProps['multiple'];\n accessor name: DropZoneProps['name'];\n accessor required: DropZoneProps['required'];\n get value(): string;\n /** This sets the input value for a file type, which cannot be set programatically, so it can only be reset. */\n set value(value: '' | null);\n get files(): File[];\n set files(files: File[]);\n /** @private */\n [setFiles](files: File[]): void;\n /** @private */\n [getFileInput](): ReplaceType<\n Element | null | undefined,\n Element,\n HTMLInputElement\n >;\n\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DropZone extends DropZoneBase implements DropZoneProps {\n constructor();\n}" }, "Divider": { "filePath": "src/surfaces/admin/components.ts", "name": "Divider", - "description": "Configure the following properties on the divider component.", - "isPublicDocs": true, + "description": "A divider is a visual separator that creates a line between different sections of content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -65472,6 +73326,13 @@ "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -65517,7 +73378,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -65525,32 +73386,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Divider extends PreactCustomElement implements DividerProps {\n accessor direction: DividerProps['direction'];\n accessor color: DividerProps['color'];\n constructor();\n}" + "value": "declare class Divider extends PolarisCustomElement implements DividerProps {\n /**\n * The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n *\n * - `inline`: Horizontal divider for separating vertically stacked content\n * - `block`: Vertical divider for separating horizontally arranged content\n *\n * @default 'inline'\n */\n direction: DividerProps['direction'];\n /**\n * The visual prominence of the divider line.\n *\n * - `base`: Standard divider for most separations (default)\n * - `strong`: More prominent divider for major section breaks\n *\n * @default 'base'\n */\n color: DividerProps['color'];\n constructor();\n}" }, "EmailField": { "filePath": "src/surfaces/admin/components.ts", "name": "EmailField", - "description": "Configure the following properties on the email field component.", - "isPublicDocs": true, + "description": "The email field custom element class that renders an email input field in the Shopify admin interface. This component allows merchants to enter email addresses with automatic validation and optimized mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | EmailAutocompleteField | `section-${string} email` | `section-${string} home email` | `section-${string} mobile email` | `section-${string} fax email` | `section-${string} pager email` | \"shipping email\" | \"shipping home email\" | \"shipping mobile email\" | \"shipping fax email\" | \"shipping pager email\" | \"billing email\" | \"billing home email\" | \"billing mobile email\" | \"billing fax email\" | \"billing pager email\" | `section-${string} shipping email` | `section-${string} shipping home email` | `section-${string} shipping mobile email` | `section-${string} shipping fax email` | `section-${string} shipping pager email` | `section-${string} billing email` | `section-${string} billing home email` | `section-${string} billing mobile email` | `section-${string} billing fax email` | `section-${string} billing pager email`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint as to the intended content of the field for autocomplete purposes.", + "defaultValue": "'email'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -65558,50 +73433,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -65609,14 +73477,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -65624,7 +73492,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -65648,7 +73516,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -65672,7 +73540,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -65680,23 +73548,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -65734,7 +73616,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -65742,32 +73624,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class EmailField\n extends PreactFieldElement\n implements EmailFieldProps\n{\n accessor autocomplete: EmailFieldProps['autocomplete'];\n accessor maxLength: EmailFieldProps['maxLength'];\n accessor minLength: EmailFieldProps['minLength'];\n /**\n * The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class EmailField extends EmailFieldBase implements EmailFieldProps {\n constructor();\n}" }, "EmailAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "EmailAutocompleteField", "value": "'email' | 'home email' | 'mobile email' | 'fax email' | 'pager email'", - "description": "Represents autocomplete values that are valid for email input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for email inputs.\n\nAvailable values:\n- `email` - Primary email address\n- `home email` - Home email address\n- `mobile email` - Mobile device email address\n- `fax email` - Fax machine email address\n- `pager email` - Pager device email address", - "isPublicDocs": true + "description": "" }, "Grid": { "filePath": "src/surfaces/admin/components.ts", "name": "Grid", - "description": "Configure the following properties on the grid component.", - "isPublicDocs": true, + "description": "A grid is a layout component that arranges its children in rows and columns with precise control over sizing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridTemplateColumns", "value": "string", - "description": "The columns in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid columns.", "defaultValue": "'none'" }, { @@ -65775,7 +73670,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridTemplateRows", "value": "string", - "description": "The rows in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid rows.", "defaultValue": "'none'" }, { @@ -65783,7 +73678,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyItems", "value": "\"\" | JustifyItemsKeyword", - "description": "Aligns the grid items along the inline axis.", + "description": "The alignment of grid items along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -65791,7 +73686,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "\"\" | AlignItemsKeyword", - "description": "Aligns the grid items along the block axis.", + "description": "The alignment of grid items along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -65799,7 +73694,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeItems", "value": "AlignItemsKeyword | \"normal normal\" | \"normal stretch\" | \"normal baseline\" | \"normal first baseline\" | \"normal last baseline\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch baseline\" | \"stretch first baseline\" | \"stretch last baseline\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline baseline\" | \"baseline first baseline\" | \"baseline last baseline\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline baseline\" | \"first baseline first baseline\" | \"first baseline last baseline\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline baseline\" | \"last baseline first baseline\" | \"last baseline last baseline\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start baseline\" | \"start first baseline\" | \"start last baseline\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end baseline\" | \"end first baseline\" | \"end last baseline\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center baseline\" | \"center first baseline\" | \"center last baseline\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start baseline\" | \"unsafe start first baseline\" | \"unsafe start last baseline\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end baseline\" | \"unsafe end first baseline\" | \"unsafe end last baseline\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center baseline\" | \"unsafe center first baseline\" | \"unsafe center last baseline\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start baseline\" | \"safe start first baseline\" | \"safe start last baseline\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end baseline\" | \"safe end first baseline\" | \"safe end last baseline\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center baseline\" | \"safe center first baseline\" | \"safe center last baseline\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\"", - "description": "A shorthand property for `justify-items` and `align-items`.", + "description": "A shorthand for setting both `alignItems` and `justifyItems`.", "defaultValue": "'normal normal'" }, { @@ -65807,7 +73702,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "\"\" | JustifyContentKeyword", - "description": "Aligns the grid along the inline axis. This overrides the inline value of `placeContent`.", + "description": "The alignment of the grid along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -65815,7 +73710,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "\"\" | AlignContentKeyword", - "description": "Aligns the grid along the block axis. This overrides the block value of `placeContent`.", + "description": "The alignment of the grid along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -65823,7 +73718,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeContent", "value": "\"normal normal\" | \"normal stretch\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\" | AlignContentKeyword | \"normal space-between\" | \"normal space-around\" | \"normal space-evenly\" | \"baseline space-between\" | \"baseline space-around\" | \"baseline space-evenly\" | \"first baseline space-between\" | \"first baseline space-around\" | \"first baseline space-evenly\" | \"last baseline space-between\" | \"last baseline space-around\" | \"last baseline space-evenly\" | \"start space-between\" | \"start space-around\" | \"start space-evenly\" | \"end space-between\" | \"end space-around\" | \"end space-evenly\" | \"center space-between\" | \"center space-around\" | \"center space-evenly\" | \"unsafe start space-between\" | \"unsafe start space-around\" | \"unsafe start space-evenly\" | \"unsafe end space-between\" | \"unsafe end space-around\" | \"unsafe end space-evenly\" | \"unsafe center space-between\" | \"unsafe center space-around\" | \"unsafe center space-evenly\" | \"safe start space-between\" | \"safe start space-around\" | \"safe start space-evenly\" | \"safe end space-between\" | \"safe end space-around\" | \"safe end space-evenly\" | \"safe center space-between\" | \"safe center space-around\" | \"safe center space-evenly\" | \"stretch space-between\" | \"stretch space-around\" | \"stretch space-evenly\" | \"space-between normal\" | \"space-between start\" | \"space-between end\" | \"space-between center\" | \"space-between unsafe start\" | \"space-between unsafe end\" | \"space-between unsafe center\" | \"space-between safe start\" | \"space-between safe end\" | \"space-between safe center\" | \"space-between stretch\" | \"space-between space-between\" | \"space-between space-around\" | \"space-between space-evenly\" | \"space-around normal\" | \"space-around start\" | \"space-around end\" | \"space-around center\" | \"space-around unsafe start\" | \"space-around unsafe end\" | \"space-around unsafe center\" | \"space-around safe start\" | \"space-around safe end\" | \"space-around safe center\" | \"space-around stretch\" | \"space-around space-between\" | \"space-around space-around\" | \"space-around space-evenly\" | \"space-evenly normal\" | \"space-evenly start\" | \"space-evenly end\" | \"space-evenly center\" | \"space-evenly unsafe start\" | \"space-evenly unsafe end\" | \"space-evenly unsafe center\" | \"space-evenly safe start\" | \"space-evenly safe end\" | \"space-evenly safe center\" | \"space-evenly stretch\" | \"space-evenly space-between\" | \"space-evenly space-around\" | \"space-evenly space-evenly\"", - "description": "A shorthand property for `justify-content` and `align-content`.", + "description": "A shorthand for setting both `alignContent` and `justifyContent`.", "defaultValue": "'normal normal'" }, { @@ -65831,7 +73726,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows and columns.", "defaultValue": "'none'" }, { @@ -65839,7 +73734,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "s spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows.", "defaultValue": "'' - meaning no override" }, { @@ -65847,7 +73742,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid columns.", "defaultValue": "'' - meaning no override" }, { @@ -65855,7 +73750,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -65863,7 +73758,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -65871,7 +73766,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -65879,7 +73774,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -65887,7 +73782,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -65895,7 +73790,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -65903,7 +73798,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -65911,7 +73806,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -65919,7 +73814,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -65927,7 +73822,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -65935,7 +73830,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -65943,7 +73838,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -65951,7 +73846,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -65959,7 +73854,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -65967,7 +73862,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -65975,7 +73870,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -65983,7 +73878,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -66003,7 +73898,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -66011,7 +73906,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -66019,7 +73914,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -66027,7 +73922,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -66035,14 +73930,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -66050,9 +73945,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -66098,7 +74000,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -66106,96 +74008,101 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n accessor gridTemplateColumns: GridProps['gridTemplateColumns'];\n accessor gridTemplateRows: GridProps['gridTemplateRows'];\n accessor justifyItems: GridProps['justifyItems'];\n accessor alignItems: GridProps['alignItems'];\n accessor placeItems: GridProps['placeItems'];\n accessor justifyContent: GridProps['justifyContent'];\n accessor alignContent: GridProps['alignContent'];\n accessor placeContent: GridProps['placeContent'];\n accessor gap: GridProps['gap'];\n accessor rowGap: GridProps['rowGap'];\n accessor columnGap: GridProps['columnGap'];\n}" + "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n /**\n * The template that defines the grid columns.\n */\n gridTemplateColumns: GridProps['gridTemplateColumns'];\n /**\n * The template that defines the grid rows.\n */\n gridTemplateRows: GridProps['gridTemplateRows'];\n /**\n * The alignment of grid items along the inline axis.\n */\n justifyItems: GridProps['justifyItems'];\n /**\n * The alignment of grid items along the block axis.\n */\n alignItems: GridProps['alignItems'];\n /**\n * A shorthand for setting both `alignItems` and `justifyItems`.\n */\n placeItems: GridProps['placeItems'];\n /**\n * The alignment of the grid along the inline axis.\n */\n justifyContent: GridProps['justifyContent'];\n /**\n * The alignment of the grid along the block axis.\n */\n alignContent: GridProps['alignContent'];\n /**\n * A shorthand for setting both `alignContent` and `justifyContent`.\n */\n placeContent: GridProps['placeContent'];\n /**\n * The spacing between grid rows and columns.\n */\n gap: GridProps['gap'];\n /**\n * The spacing between grid rows.\n */\n rowGap: GridProps['rowGap'];\n /**\n * The spacing between grid columns.\n */\n columnGap: GridProps['columnGap'];\n}" }, "JustifyItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.\n\nLearn more about the [justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).", - "isPublicDocs": true + "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis." }, "BaselinePosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BaselinePosition", "value": "'baseline' | 'first baseline' | 'last baseline'", - "description": "Represents baseline alignment positions used to align items relative to their baselines.\n- `baseline`: Aligns to the baseline of the parent.\n- `first baseline`: Aligns to the first baseline of the parent.\n- `last baseline`: Aligns to the last baseline of the parent.", - "isPublicDocs": true + "description": "" }, "OverflowPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "OverflowPosition", "value": "`unsafe ${ContentPosition}` | `safe ${ContentPosition}`", - "description": "Represents content positioning with overflow behavior control. Use `safe` to prevent content from becoming inaccessible when it overflows, or `unsafe` to allow overflow regardless of accessibility.", - "isPublicDocs": true + "description": "" }, "ContentPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentPosition", "value": "'center' | 'start' | 'end'", - "description": "Defines the position of content along an axis.\n- `center`: Centers the content.\n- `start`: Aligns content to the start.\n- `end`: Aligns content to the end.", - "isPublicDocs": true + "description": "" }, "AlignItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Align items sets the align-self value on all direct children as a group.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isPublicDocs": true + "description": "Align items sets the align-self value on all direct children as a group." }, "JustifyContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyContentKeyword", "value": "'normal' | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", - "isPublicDocs": true + "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container." }, "ContentDistribution": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentDistribution", "value": "'space-between' | 'space-around' | 'space-evenly' | 'stretch'", - "description": "Defines how space is distributed between and around content items in flex and grid layouts.\n- `space-between`: Distributes items evenly with the first item at the start and last at the end.\n- `space-around`: Distributes items evenly with equal space around each item.\n- `space-evenly`: Distributes items evenly with equal space between them.\n- `stretch`: Stretches items to fill the container.", - "isPublicDocs": true + "description": "" }, "AlignContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignContentKeyword", "value": "'normal' | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isPublicDocs": true + "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis." }, "SpacingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SpacingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the spacing size between elements, using the standard size scale or `none` for no spacing.", - "isPublicDocs": true + "description": "" }, "GridItem": { "filePath": "src/surfaces/admin/components.ts", "name": "GridItem", - "description": "The grid item component represents a single cell within a grid layout, allowing you to control how content is positioned and sized within the grid. Use grid item as a child of grid to specify column span, row span, and positioning for individual content areas.\n\nGrid item supports precise placement control through column and row properties, enabling you to create complex layouts where different items occupy varying amounts of space or appear in specific grid positions.", - "isPublicDocs": true, + "description": "A grid item is a child of a grid that can be positioned within specific rows and columns.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridColumn", "value": "\"auto\" | `span ${number}`", - "description": "The number of columns the item will span across.\n\nLearn more about the [grid-column property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).", + "description": "The column position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -66203,7 +74110,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridRow", "value": "\"auto\" | `span ${number}`", - "description": "The number of rows the item will span across.\n\nLearn more about the [grid-row property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).", + "description": "The row position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -66211,7 +74118,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -66219,7 +74126,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -66227,7 +74134,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -66235,7 +74142,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -66243,7 +74150,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -66251,7 +74158,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -66259,7 +74166,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -66267,7 +74174,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -66275,7 +74182,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -66283,7 +74190,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -66291,7 +74198,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -66299,7 +74206,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -66307,7 +74214,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -66315,7 +74222,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -66323,7 +74230,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -66331,7 +74238,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -66339,7 +74246,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -66359,7 +74266,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -66367,7 +74274,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -66375,7 +74282,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -66383,7 +74290,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -66391,14 +74298,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -66406,9 +74313,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -66454,7 +74368,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -66462,24 +74376,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class GridItem extends BoxElement implements GridItemProps {\n accessor gridColumn: GridItemProps['gridColumn'];\n accessor gridRow: GridItemProps['gridRow'];\n constructor();\n}" + "value": "declare class GridItem extends BoxElement implements GridItemProps {\n /**\n * The column position and span of the grid item.\n */\n gridColumn: GridItemProps['gridColumn'];\n /**\n * The row position and span of the grid item.\n */\n gridRow: GridItemProps['gridRow'];\n constructor();\n}" }, "Heading": { "filePath": "src/surfaces/admin/components.ts", "name": "Heading", - "description": "Configure the following properties on the heading component.", - "isPublicDocs": true, + "description": "A custom element for displaying hierarchical section titles and headings with appropriate semantic meaning and visual styling. Use Heading to structure your content with proper heading levels for both visual hierarchy and accessibility.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"heading\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The ARIA role for the heading. Set to `'heading'` (the default) for standard heading semantics, or `'presentation'` / `'none'` to remove heading semantics for decorative use.", "defaultValue": "'heading'" }, { @@ -66487,7 +74415,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lineClamp", "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", "defaultValue": "Infinity - no truncation is applied" }, { @@ -66495,9 +74423,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -66543,7 +74478,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -66551,47 +74486,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Heading extends PreactCustomElement implements HeadingProps {\n accessor accessibilityRole: HeadingProps['accessibilityRole'];\n accessor lineClamp: HeadingProps['lineClamp'];\n accessor accessibilityVisibility: HeadingProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Heading extends HeadingBase implements HeadingProps {\n constructor();\n}" }, "Icon": { "filePath": "src/surfaces/admin/components.ts", "name": "Icon", - "description": "Configure the following properties on the icon component.", - "isPublicDocs": true, + "description": "An icon displays a graphical symbol from the icon library.", "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", + "description": "The color tone of the icon based on its semantic meaning.", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "The icon to display from the icon library.\n\nSet to a valid icon name to display that icon. To hide the icon completely, use an empty string `''`. To reserve the icon's space without displaying an icon, use `'empty'`." + "value": "\"\" | IconType", + "description": "The type of icon to display." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color emphasis of the icon.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"base\"", - "description": "The size of the icon.\n\n- `small`: Smaller icon suitable for inline use within text or compact UI elements.\n- `base`: Default size that works well for standalone icons and standard use cases.", + "description": "The size of the icon.", "defaultValue": "'base'" }, { @@ -66599,7 +74548,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The element that this icon should show interest for when activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -66646,7 +74602,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -66654,53 +74610,67 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Icon extends PreactCustomElement implements IconProps {\n accessor color: IconProps['color'];\n accessor tone: IconProps['tone'];\n accessor type: IconProps['type'];\n accessor size: IconProps['size'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Icon extends IconBase implements IconProps {\n /**\n * The color tone of the icon based on its semantic meaning.\n */\n tone: IconProps['tone'];\n /**\n * The type of icon to display.\n */\n type: IconProps['type'];\n constructor();\n}" }, "Image": { "filePath": "src/surfaces/admin/components.ts", "name": "Image", - "description": "Configure the following properties on the image component.", - "isPublicDocs": true, + "description": "An image displays pictures with configurable sizing, loading behavior, and borders.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "srcSet", "value": "string", - "description": "A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n\nLearn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset)." + "description": "A set of source images with different sizes for responsive loading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "sizes", "value": "string", - "description": "A set of media conditions and their corresponding sizes.\n\nLearn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes)." + "description": "The sizes of the image at different viewport widths." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "aspectRatio", "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", - "description": "The aspect ratio of the image.\n\nThe rendering of the image will depend on the `inlineSize` value:\n\n- `inlineSize=\"fill\"`: the aspect ratio will be respected and the image will take the necessary space.\n- `inlineSize=\"auto\"`: the image will not render until it has loaded and the aspect ratio will be ignored.\n\nFor example, if the value is set as `50 / 100`, the getter returns `50 / 100`. If the value is set as `0.5`, the getter returns `0.5 / 1`.\n\nLearn more about the [aspect-ratio property](https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio).", + "description": "The aspect ratio of the image as a width-to-height ratio.", "defaultValue": "'1/1'" }, { @@ -66708,7 +74678,7 @@ "syntaxKind": "PropertyDeclaration", "name": "objectFit", "value": "\"contain\" | \"cover\"", - "description": "The image resizing behavior to fit within its container.\n\n- `contain`: Scales the image to fit within the container while maintaining its aspect ratio. The entire image is visible, but might leave empty space.\n- `cover`: Scales the image to fill the entire container while maintaining its aspect ratio. The image might be cropped to fit.\n\nThe image is always positioned in the center of the container.\n\nLearn more about the [object-fit property](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).", + "description": "How the image should be resized to fit its container.", "defaultValue": "'contain'" }, { @@ -66716,7 +74686,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "\"eager\" | \"lazy\"", - "description": "The loading strategy for the image.\n\n- `eager`: Immediately loads the image, irrespective of its position within the visible viewport.\n- `lazy`: Delays loading the image until it approaches a specified distance from the viewport.\n\nLearn more about the [loading attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading).", + "description": "When the image should be loaded.", "defaultValue": "'eager'" }, { @@ -66724,7 +74694,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"img\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The accessibility role for the image.", "defaultValue": "'img'" }, { @@ -66732,7 +74702,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "\"auto\" | \"fill\"", - "description": "The displayed inline width of the image.\n\n- `fill`: the image will takes up 100% of the available inline size.\n- `auto`: the image will be displayed at its natural size.\n\nLearn more about the [width attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#width).", + "description": "The inline size (width in horizontal writing modes) of the image.", "defaultValue": "'fill'" }, { @@ -66740,35 +74710,23 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied around the image using shorthand syntax to specify width, color, and style in a single property.", - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "description": "Whether to show a border around the image.", + "defaultValue": "'none' - equivalent to `none base auto`." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderWidth", - "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderStyle", - "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image.", "defaultValue": "'' - meaning no override" }, { @@ -66776,17 +74734,161 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "The color of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the image's corners using the design system's radius scale.", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image.", "defaultValue": "'none'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Image extends PolarisCustomElement implements ImageProps {\n /**\n * The URL of the image to display.\n */\n src: ImageProps['src'];\n /**\n * A set of source images with different sizes for responsive loading.\n */\n srcSet: ImageProps['srcSet'];\n /**\n * The sizes of the image at different viewport widths.\n */\n sizes: ImageProps['sizes'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ImageProps['alt'];\n /**\n * The aspect ratio of the image as a width-to-height ratio.\n */\n aspectRatio: ImageProps['aspectRatio'];\n /**\n * How the image should be resized to fit its container.\n */\n objectFit: ImageProps['objectFit'];\n /**\n * When the image should be loaded.\n */\n loading: ImageProps['loading'];\n /**\n * The accessibility role for the image.\n */\n accessibilityRole: ImageProps['accessibilityRole'];\n /**\n * The inline size (width in horizontal writing modes) of the image.\n */\n inlineSize: ImageProps['inlineSize'];\n /**\n * Whether to show a border around the image.\n */\n border: ImageProps['border'];\n /**\n * The width of the border around the image.\n */\n borderWidth: ImageProps['borderWidth'];\n /**\n * The style of the border around the image.\n */\n borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image.\n */\n borderColor: ImageProps['borderColor'];\n /**\n * The radius of the border corners around the image.\n */\n borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + }, + "BorderRadiusKeyword": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "BorderRadiusKeyword", + "value": "SizeKeyword | 'max' | 'none'", + "description": "" + }, + "Link": { + "filePath": "src/surfaces/admin/components.ts", + "name": "Link", + "description": "", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "target", + "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", + "description": "Specifies where to display the linked URL.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -66832,7 +74934,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -66840,124 +74942,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Image extends PreactCustomElement implements ImageProps {\n accessor src: ImageProps['src'];\n accessor srcSet: ImageProps['srcSet'];\n accessor sizes: ImageProps['sizes'];\n accessor alt: ImageProps['alt'];\n accessor aspectRatio: ImageProps['aspectRatio'];\n accessor objectFit: ImageProps['objectFit'];\n accessor loading: ImageProps['loading'];\n accessor accessibilityRole: ImageProps['accessibilityRole'];\n accessor inlineSize: ImageProps['inlineSize'];\n /**\n * A border applied around the image using shorthand syntax to specify width, color, and style in a single property.\n */\n accessor border: ImageProps['border'];\n /**\n * The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.\n */\n accessor borderWidth: ImageProps['borderWidth'];\n /**\n * The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.\n */\n accessor borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.\n */\n accessor borderColor: ImageProps['borderColor'];\n /**\n * The roundedness of the image's corners using the design system's radius scale.\n */\n accessor borderRadius: ImageProps['borderRadius'];\n constructor();\n}" - }, - "Link": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Link", - "description": "Configure the following properties on the link component.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "href", - "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "target", - "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", - "defaultValue": "'auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "download", - "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "lang", - "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", + "name": "__@flushRenderSymbol@16092", "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -66965,24 +74973,30 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Link extends Link_base implements LinkProps {\n accessor tone: LinkProps['tone'];\n accessor accessibilityLabel: LinkProps['accessibilityLabel'];\n accessor href: LinkProps['href'];\n accessor target: LinkProps['target'];\n accessor download: LinkProps['download'];\n accessor lang: LinkProps['lang'];\n constructor();\n}" + "value": "declare class Link extends LinkBase implements LinkProps {\n tone: LinkProps['tone'];\n constructor();\n}" }, "ListItem": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItem", - "description": "The list item component represents a single entry within an ordered list or unordered list. Use list item to structure individual points, steps, or items within a list, with each item automatically receiving appropriate list markers (bullets or numbers) from its parent list.\n\nList item must be used as a direct child of ordered list or unordered list components. Each list item can contain text, inline formatting, or other components to create rich list content.", - "isPublicDocs": true, + "description": "A component that represents a single item within an ordered list or unordered list.\n\nUse list item as a child of ordered list or unordered list to create properly structured and accessible list content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -67028,7 +75042,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -67036,24 +75050,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ListItem extends PreactCustomElement implements ListItemProps {\n constructor();\n}" + "value": "declare class ListItem extends PolarisCustomElement implements ListItemProps {\n constructor();\n}" }, "Menu": { "filePath": "src/surfaces/admin/components.ts", "name": "Menu", - "description": "Configure the following properties on the menu component.", - "isPublicDocs": true, + "description": "A component that displays a contextual list of actions or options, which is typically triggered by a button or other activator element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the menu for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", @@ -67074,7 +75102,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -67082,7 +75110,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -67090,11 +75118,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -67124,7 +75159,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -67132,24 +75167,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n accessor accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n /**\n * A label that describes the menu for assistive technologies.\n */\n accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "MoneyField": { "filePath": "src/surfaces/admin/components.ts", "name": "MoneyField", - "description": "Configure the following properties on the money field component.", - "isPublicDocs": true, + "description": "The money field custom element class that renders a monetary input field in the Shopify admin interface. This component allows merchants to enter currency amounts with automatic formatting, decimal precision, and validation against minimum and maximum values.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum monetary value allowed in the field.", "defaultValue": "Infinity" }, { @@ -67157,9 +75206,17 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum monetary value allowed in the field.", "defaultValue": "-Infinity" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "currencyCode", + "value": "\"auto\" | CurrencyCode", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -67172,7 +75229,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "string", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -67180,35 +75237,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -67216,14 +75273,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -67231,7 +75288,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -67255,7 +75312,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -67279,7 +75336,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -67287,23 +75344,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -67341,7 +75405,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -67349,17 +75413,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class MoneyField\n extends PreactFieldElement\n implements MoneyFieldProps\n{\n accessor max: MoneyFieldProps['max'];\n accessor min: MoneyFieldProps['min'];\n /**\n * The current monetary value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string representing the amount in the store's currency.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class MoneyField extends MoneyFieldBase implements MoneyFieldProps {\n constructor();\n}" + }, + "CurrencyCode": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CurrencyCode", + "value": "'USD' | 'EUR' | 'GBP' | 'CAD' | 'AFN' | 'ALL' | 'DZD' | 'AOA' | 'ARS' | 'AMD' | 'AWG' | 'AUD' | 'BBD' | 'AZN' | 'BDT' | 'BSD' | 'BHD' | 'BIF' | 'BZD' | 'BMD' | 'BTN' | 'BAM' | 'BRL' | 'BOB' | 'BWP' | 'BND' | 'BGN' | 'MMK' | 'KHR' | 'CVE' | 'KYD' | 'XAF' | 'CLP' | 'CNY' | 'COP' | 'KMF' | 'CDF' | 'CRC' | 'HRK' | 'CZK' | 'DKK' | 'DOP' | 'XCD' | 'EGP' | 'ETB' | 'XPF' | 'FJD' | 'GMD' | 'GHS' | 'GTQ' | 'GYD' | 'GEL' | 'HTG' | 'HNL' | 'HKD' | 'HUF' | 'ISK' | 'INR' | 'IDR' | 'ILS' | 'IQD' | 'JMD' | 'JPY' | 'JEP' | 'JOD' | 'KZT' | 'KES' | 'KWD' | 'KGS' | 'LAK' | 'LVL' | 'LBP' | 'LSL' | 'LRD' | 'LTL' | 'MGA' | 'MKD' | 'MOP' | 'MWK' | 'MVR' | 'MXN' | 'MYR' | 'MUR' | 'MDL' | 'MAD' | 'MNT' | 'MZN' | 'NAD' | 'NPR' | 'ANG' | 'NZD' | 'NIO' | 'NGN' | 'NOK' | 'OMR' | 'PAB' | 'PKR' | 'PGK' | 'PYG' | 'PEN' | 'PHP' | 'PLN' | 'QAR' | 'RON' | 'RUB' | 'RWF' | 'WST' | 'SAR' | 'RSD' | 'SCR' | 'SGD' | 'SDG' | 'SYP' | 'ZAR' | 'KRW' | 'SSP' | 'SBD' | 'LKR' | 'SRD' | 'SZL' | 'SEK' | 'CHF' | 'TWD' | 'THB' | 'TZS' | 'TTD' | 'TND' | 'TRY' | 'TMT' | 'UGX' | 'UAH' | 'AED' | 'UYU' | 'UZS' | 'VUV' | 'VND' | 'XOF' | 'YER' | 'ZMW' | 'BYN' | 'BYR' | 'DJF' | 'ERN' | 'FKP' | 'GIP' | 'GNF' | 'IRR' | 'KID' | 'LYD' | 'MRU' | 'SLL' | 'SHP' | 'SOS' | 'STD' | 'STN' | 'TJS' | 'TOP' | 'VED' | 'VEF' | 'VES' | 'XXX'", + "description": "" }, "NumberField": { "filePath": "src/surfaces/admin/components.ts", "name": "NumberField", - "description": "Configure the following properties on the number field component.", - "isPublicDocs": true, + "description": "The number field custom element class that renders a numeric input field in the Shopify admin interface. This component allows merchants to enter numbers with automatic validation and prefix/suffix display.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -67373,7 +75458,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inputMode", "value": "\"decimal\" | \"numeric\"", - "description": "The type of virtual keyboard to display on mobile devices.\n\n- `decimal`: Shows a numeric keyboard with a decimal point, suitable for prices or measurements.\n- `numeric`: Shows a numeric keyboard without a decimal point, suitable for whole numbers like quantities.\n\nLearn more about the [inputmode attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode).", + "description": "The input mode hint for mobile keyboards. Available values include:\n- `numeric`: Shows a numeric keypad optimized for entering numbers\n- `decimal`: Shows a numeric keypad with decimal point support\n- `tel`: Shows a telephone keypad", "defaultValue": "'decimal'" }, { @@ -67381,7 +75466,7 @@ "syntaxKind": "PropertyDeclaration", "name": "step", "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "description": "The granularity that the value must adhere to, or the keyword `any`. This controls the increment/decrement step size.", "defaultValue": "1" }, { @@ -67389,7 +75474,7 @@ "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum numeric value allowed in the field.", "defaultValue": "Infinity" }, { @@ -67397,7 +75482,7 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum numeric value allowed in the field.", "defaultValue": "-Infinity" }, { @@ -67405,7 +75490,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the user's input, such as a currency symbol.", "defaultValue": "''" }, { @@ -67413,7 +75498,7 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the user's input, such as a unit of measurement.", "defaultValue": "''" }, { @@ -67421,7 +75506,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | NumberAutocompleteField | `section-${string} one-time-code` | `section-${string} cc-number` | `section-${string} cc-csc` | \"shipping one-time-code\" | \"shipping cc-number\" | \"shipping cc-csc\" | \"billing one-time-code\" | \"billing cc-number\" | \"billing cc-csc\" | `section-${string} shipping one-time-code` | `section-${string} shipping cc-number` | `section-${string} shipping cc-csc` | `section-${string} billing one-time-code` | `section-${string} billing cc-number` | `section-${string} billing cc-csc`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -67429,35 +75514,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -67465,14 +75550,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -67480,7 +75565,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -67504,7 +75589,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -67528,7 +75613,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -67536,23 +75621,146 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class NumberField extends NumberFieldBase implements NumberFieldProps {\n constructor();\n}" + }, + "NumberAutocompleteField": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "NumberAutocompleteField", + "value": "'one-time-code' | 'cc-number' | 'cc-csc'", + "description": "" + }, + "Option": { + "filePath": "src/surfaces/admin/components.ts", + "name": "Option", + "description": "A single option within a select dropdown that users can choose.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "selected", + "value": "boolean", + "description": "Whether the option is currently selected.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "defaultSelected", + "value": "boolean", + "description": "Whether the option should be selected when it's first rendered.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "value", + "value": "string", + "description": "The value that's submitted with the form when this option is selected." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "disabled", + "value": "boolean", + "description": "Whether the option is disabled and can't be selected.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -67569,6 +75777,14 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -67590,7 +75806,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -67598,128 +75814,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class NumberField\n extends PreactFieldElement\n implements NumberFieldProps\n{\n /**\n * The current numeric value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string (decimal or integer).\n */\n get value(): string;\n set value(value: string);\n accessor inputMode: NumberFieldProps['inputMode'];\n accessor step: NumberFieldProps['step'];\n accessor max: NumberFieldProps['max'];\n accessor min: NumberFieldProps['min'];\n accessor prefix: NumberFieldProps['prefix'];\n accessor suffix: NumberFieldProps['suffix'];\n constructor();\n}" - }, - "NumberAutocompleteField": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "NumberAutocompleteField", - "value": "'one-time-code' | 'cc-number' | 'cc-csc'", - "description": "Represents autocomplete values that are valid for number input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for numeric inputs.\n\nAvailable values:\n- `one-time-code` - One-time codes for authentication (OTP, 2FA codes)\n- `cc-number` - Credit card number\n- `cc-csc` - Credit card security code (CVV/CVC)", - "isPublicDocs": true - }, - "Option": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Option", - "description": "Represents a single option within a select component. Use only as a child of s-select components.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "selected", - "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", - "defaultValue": "false" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "defaultSelected", - "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", - "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "value", - "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", - "defaultValue": "false" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", + "name": "__@flushRenderSymbol@16092", "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Option extends PreactCustomElement implements OptionProps {\n accessor selected: OptionProps['selected'];\n accessor defaultSelected: OptionProps['defaultSelected'];\n accessor value: OptionProps['value'];\n accessor disabled: OptionProps['disabled'];\n constructor();\n}" + "value": "declare class Option extends PolarisCustomElement implements OptionProps {\n /**\n * Whether the option is currently selected.\n */\n selected: OptionProps['selected'];\n /**\n * Whether the option should be selected when it's first rendered.\n */\n defaultSelected: OptionProps['defaultSelected'];\n /**\n * The value that's submitted with the form when this option is selected.\n */\n value: OptionProps['value'];\n /**\n * Whether the option is disabled and can't be selected.\n */\n disabled: OptionProps['disabled'];\n constructor();\n}" }, "OptionGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionGroup", - "description": "Represents a group of options within a select component. Use only as a child of `s-select` components.", - "isPublicDocs": true, + "description": "A group of related options within a select dropdown, displayed with a label.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the options within this group can be selected or not.", + "description": "Whether all options in the group are disabled and can't be selected.", "defaultValue": "false" }, { @@ -67727,7 +75853,14 @@ "syntaxKind": "PropertyDeclaration", "name": "label", "value": "string", - "description": "The user-facing label for this group of options." + "description": "The text that describes what this group of options represents." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -67774,7 +75907,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -67782,18 +75915,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OptionGroup\n extends PreactCustomElement\n implements OptionGroupProps\n{\n accessor disabled: OptionGroupProps['disabled'];\n accessor label: OptionGroupProps['label'];\n constructor();\n}" + "value": "declare class OptionGroup\n extends PolarisCustomElement\n implements OptionGroupProps\n{\n /**\n * Whether all options in the group are disabled and can't be selected.\n */\n disabled: OptionGroupProps['disabled'];\n /**\n * The text that describes what this group of options represents.\n */\n label: OptionGroupProps['label'];\n constructor();\n}" }, "OrderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "OrderedList", - "description": "Configure the following properties on the ordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a numbered list of items with automatic numbering and proper list semantics. Use ordered list when the sequence or order of items matters, such as instructions, rankings, or step-by-step processes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -67839,7 +75993,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -67847,48 +76001,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OrderedList\n extends PreactCustomElement\n implements OrderedListProps\n{\n constructor();\n}" + "value": "declare class OrderedList\n extends PolarisCustomElement\n implements OrderedListProps\n{\n constructor();\n}" }, "Paragraph": { "filePath": "src/surfaces/admin/components.ts", "name": "Paragraph", - "description": "Configure the following properties on the paragraph component.", - "isPublicDocs": true, + "description": "A custom element for displaying blocks of text content with consistent spacing and styling for readable body copy. Use Paragraph to render longer text content with proper line height and spacing between paragraphs.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "lineClamp", - "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", - "defaultValue": "Infinity - no truncation is applied" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the paragraph text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"caution\"", - "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "lineClamp", + "value": "number", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", + "defaultValue": "Infinity - no truncation is applied" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color of the paragraph text.", "defaultValue": "'base'" }, { @@ -67896,7 +76064,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -67904,9 +76072,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -67952,7 +76127,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -67960,24 +76135,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Paragraph extends PreactCustomElement implements ParagraphProps {\n accessor fontVariantNumeric: ParagraphProps['fontVariantNumeric'];\n accessor lineClamp: ParagraphProps['lineClamp'];\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: ParagraphProps['tone'];\n\n accessor color: ParagraphProps['color'];\n accessor dir: ParagraphProps['dir'];\n accessor accessibilityVisibility: ParagraphProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Paragraph extends ParagraphBase implements ParagraphProps {\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: ParagraphProps['tone'];\n constructor();\n}" }, "PasswordField": { "filePath": "src/surfaces/admin/components.ts", "name": "PasswordField", - "description": "Configure the following properties on the password field component.", - "isPublicDocs": true, + "description": "The password field custom element class that renders a password input field in the Shopify admin interface. This component allows merchants to enter passwords securely with characters automatically masked for privacy.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the password.", "defaultValue": "Infinity" }, { @@ -67985,22 +76174,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the password.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | PasswordAutocompleteField | `section-${string} current-password` | `section-${string} new-password` | \"shipping current-password\" | \"shipping new-password\" | \"billing current-password\" | \"billing new-password\" | `section-${string} shipping current-password` | `section-${string} shipping new-password` | `section-${string} billing current-password` | `section-${string} billing new-password`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -68008,35 +76190,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -68044,14 +76226,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -68059,7 +76241,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -68083,7 +76265,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -68107,7 +76289,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -68115,23 +76297,130 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class PasswordField\n extends PasswordFieldBase\n implements PasswordFieldProps\n{\n constructor();\n}" + }, + "PasswordAutocompleteField": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "PasswordAutocompleteField", + "value": "'current-password' | 'new-password'", + "description": "" + }, + "QueryContainer": { + "filePath": "src/surfaces/admin/components.ts", + "name": "QueryContainer", + "description": "A component that sets up a container query context, which lets child elements style themselves based on the container's size instead of the viewport size.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "containerName", + "value": "string", + "description": "The name of the container, which you can reference in CSS container queries.", + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -68148,6 +76437,14 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -68169,7 +76466,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -68177,105 +76474,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - } - ], - "value": "declare class PasswordField\n extends PreactFieldElement\n implements PasswordFieldProps\n{\n accessor maxLength: PasswordFieldProps['maxLength'];\n accessor minLength: PasswordFieldProps['minLength'];\n /**\n * The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" - }, - "PasswordAutocompleteField": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "PasswordAutocompleteField", - "value": "'current-password' | 'new-password'", - "description": "Represents autocomplete values that are valid for password input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for password inputs.\n\nAvailable values:\n- `current-password` - Existing password for login or authentication\n- `new-password` - New password when creating an account or changing password", - "isPublicDocs": true - }, - "QueryContainer": { - "filePath": "src/surfaces/admin/components.ts", - "name": "QueryContainer", - "description": "Configure the following properties on the query container component.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "containerName", - "value": "string", - "description": "An identifier for this container that you can reference in CSS container queries to apply styles based on this specific container's size.\n\nAll query container components automatically receive a container name of `s-default`. You can omit the container name in your queries, so `@container (inline-size <= 300px)` is equivalent to `@container s-default (inline-size <= 300px)`.\n\nWhen you provide a custom `containerName`, it's added alongside `s-default`. For example, `containerName=\"product-card\"` results in `s-default product-card` being set on the `container-name` CSS property, allowing you to target this container with `@container product-card (inline-size <= 300px)`.\n\nLearn more about the [container-name property](https://developer.mozilla.org/en-US/docs/Web/CSS/container-name).", - "defaultValue": "''" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "queueRender", + "name": "__@flushRenderSymbol@16092", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class QueryContainer\n extends PreactCustomElement\n implements QueryContainerProps\n{\n accessor containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" + "value": "declare class QueryContainer\n extends PolarisCustomElement\n implements QueryContainerProps\n{\n /**\n * The name of the container, which you can reference in CSS container queries.\n */\n containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" }, "SearchField": { "filePath": "src/surfaces/admin/components.ts", "name": "SearchField", - "description": "Configure the following properties on the search field component.", - "isPublicDocs": true, + "description": "A search field that lets users enter search queries with a search-specific input type.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters that can be entered in the field.", "defaultValue": "Infinity" }, { @@ -68283,22 +76513,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters that must be entered for the field to be valid.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -68306,35 +76529,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -68342,14 +76565,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -68357,7 +76580,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -68381,7 +76604,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -68405,7 +76628,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -68413,23 +76636,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -68467,7 +76704,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -68475,25 +76712,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class SearchField\n extends PreactFieldElement\n implements SearchFieldProps\n{\n accessor maxLength: SearchFieldProps['maxLength'];\n accessor minLength: SearchFieldProps['minLength'];\n /**\n * The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class SearchField extends SearchFieldBase implements SearchFieldProps {\n constructor();\n}" }, "TextAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" }, "Section": { "filePath": "src/surfaces/admin/components.ts", "name": "Section", - "description": "Configure the following properties on the section component.", - "isPublicDocs": true, + "description": "A section is a container that groups related content together with an optional heading.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -68503,28 +76753,43 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "The accessibility label for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The heading text displayed at the top of the section. This heading provides a title for the section's content and automatically uses the appropriate semantic heading level (h2, h3, h4) based on nesting depth to maintain proper document structure." + "description": "The heading text for the section." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "\"base\" | \"none\"", - "description": "The padding applied to all edges of the element.\n\n- `base`: applies padding that is appropriate for the element. Note that it might result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the section need to span to the edge of the section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "description": "Whether the section has padding.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -68541,14 +76806,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -68562,7 +76819,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -68570,59 +76827,73 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Section extends PreactCustomElement implements SectionProps {\n constructor();\n /** @private */\n connectedCallback(): void;\n accessor accessibilityLabel: SectionProps['accessibilityLabel'];\n accessor heading: SectionProps['heading'];\n accessor padding: SectionProps['padding'];\n}" + "value": "declare class Section extends SectionBase implements SectionProps {\n constructor();\n}" }, "Select": { "filePath": "src/surfaces/admin/components.ts", "name": "Select", - "description": "Configure the following properties on the select component.", - "isPublicDocs": true, + "description": "A select dropdown that lets users choose one option from a list.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier." + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the select." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the select when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the select is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "Text that appears in the select when no option is selected to provide a hint about what to choose." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether an option must be selected before the form can be submitted.", "defaultValue": "false" }, { @@ -68630,7 +76901,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -68654,7 +76925,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component." + "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected Option component." }, { "filePath": "src/surfaces/admin/components.ts", @@ -68667,15 +76938,15 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@usedFirstOptionSymbol@12029", + "name": "__@usedFirstOptionSymbol@17470", "value": "boolean", - "description": "A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n\nThis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.", + "description": "used to determine if no value or defaultValue was set, in which case the first non-disabled option was used\n\nthis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@hasInitialValueSymbol@12030", + "name": "__@hasInitialValueSymbol@17471", "value": "boolean", "description": "", "isPrivate": true @@ -68685,7 +76956,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -68693,23 +76964,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -68739,7 +77017,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -68747,33 +77025,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Select extends PreactInputElement implements SelectProps {\n accessor icon: SelectProps['icon'];\n accessor details: SelectProps['details'];\n accessor error: SelectProps['error'];\n accessor label: SelectProps['label'];\n accessor placeholder: SelectProps['placeholder'];\n accessor required: SelectProps['required'];\n accessor labelAccessibilityVisibility: SelectProps['labelAccessibilityVisibility'];\n /** @private */\n connectedCallback(): void;\n /**\n * A lifecycle callback that fires when the component is removed from the DOM. Performs cleanup operations.\n * @private\n */\n disconnectedCallback(): void;\n constructor();\n /**\n * A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n *\n * This is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.\n * @private\n */\n [usedFirstOptionSymbol]: boolean;\n /**\n * @private\n */\n [hasInitialValueSymbol]: boolean;\n /**\n * The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component.\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n}" + "value": "declare class Select extends SelectBase implements SelectProps {\n constructor();\n}" }, "Spinner": { "filePath": "src/surfaces/admin/components.ts", "name": "Spinner", - "description": "Configure the following properties on the spinner component.", - "isPublicDocs": true, + "description": "A component that displays an animated loading indicator to show that content is currently being processed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the spinner for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the loading spinner.\n\n- `base`: Default size suitable for inline loading indicators or standard UI contexts.\n- `large`: Larger spinner for more prominent loading states.\n- `large-100`: Extra large spinner for full-page or emphasized loading states.", + "description": "The size of the spinner.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -68819,7 +77118,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -68827,24 +77126,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Spinner extends PreactCustomElement implements SpinnerProps {\n accessor accessibilityLabel: string;\n accessor size: SpinnerProps['size'];\n constructor();\n}" + "value": "declare class Spinner extends PolarisCustomElement implements SpinnerProps {\n /**\n * A label that describes the spinner for assistive technologies.\n */\n accessibilityLabel: string;\n /**\n * The size of the spinner.\n */\n size: SpinnerProps['size'];\n constructor();\n}" }, "Stack": { "filePath": "src/surfaces/admin/components.ts", "name": "Stack", - "description": "Configure the following properties on the stack component.", - "isPublicDocs": true, + "description": "A stack is a layout component that arranges its children in a single direction with controlled spacing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "direction", "value": "MaybeResponsive<\"inline\" | \"block\">", - "description": "The direction in which the stack's children are placed within the stack.\n\nAccepts:\n- A single value, either `inline` or `block`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported direction values as a query value", + "description": "The direction in which the stack's children are arranged.", "defaultValue": "'block'" }, { @@ -68852,7 +77165,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "JustifyContentKeyword", - "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -68860,7 +77173,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "AlignItemsKeyword", - "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -68868,7 +77181,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "AlignContentKeyword", - "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.", "defaultValue": "'normal'" }, { @@ -68876,7 +77189,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between the stack's children.", "defaultValue": "'none'" }, { @@ -68884,7 +77197,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between rows in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -68892,7 +77205,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between columns in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -68900,7 +77213,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -68908,7 +77221,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -68916,7 +77229,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -68924,7 +77237,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -68932,7 +77245,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -68940,7 +77253,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -68948,7 +77261,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -68956,7 +77269,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -68964,7 +77277,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -68972,7 +77285,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -68980,7 +77293,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -68988,7 +77301,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -68996,7 +77309,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -69004,7 +77317,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -69012,7 +77325,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -69020,7 +77333,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -69028,7 +77341,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -69048,7 +77361,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -69056,7 +77369,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -69064,7 +77377,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -69072,7 +77385,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -69080,14 +77393,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -69095,9 +77408,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -69143,7 +77463,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -69151,32 +77471,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n accessor direction: StackProps['direction'];\n accessor justifyContent: StackProps['justifyContent'];\n accessor alignItems: StackProps['alignItems'];\n accessor alignContent: StackProps['alignContent'];\n accessor gap: StackProps['gap'];\n accessor rowGap: StackProps['rowGap'];\n accessor columnGap: StackProps['columnGap'];\n}" + "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n /**\n * The direction in which the stack's children are arranged.\n */\n direction: StackProps['direction'];\n /**\n * Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n */\n justifyContent: StackProps['justifyContent'];\n /**\n * Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n */\n alignItems: StackProps['alignItems'];\n /**\n * Controls the distribution of lines along the block axis when content wraps into multiple lines.\n */\n alignContent: StackProps['alignContent'];\n /**\n * The spacing between the stack's children.\n */\n gap: StackProps['gap'];\n /**\n * The spacing between rows in the stack.\n */\n rowGap: StackProps['rowGap'];\n /**\n * The spacing between columns in the stack.\n */\n columnGap: StackProps['columnGap'];\n}" }, "Switch": { "filePath": "src/surfaces/admin/components.ts", "name": "Switch", - "description": "Configure the following properties on the switch component.", - "isPublicDocs": true, + "description": "A switch that lets users toggle a setting on or off with a sliding control.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -69191,7 +77532,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -69199,28 +77540,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -69243,7 +77584,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -69251,23 +77592,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -69313,7 +77661,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -69321,24 +77669,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Switch extends PreactCheckboxElement implements SwitchProps {\n accessor labelAccessibilityVisibility: SwitchProps['labelAccessibilityVisibility'];\n constructor();\n}" + "value": "declare class Switch extends SwitchBase implements SwitchProps {\n constructor();\n}" }, "Table": { "filePath": "src/surfaces/admin/components.ts", "name": "Table", - "description": "Configure the following properties on the table component.", - "isPublicDocs": true, + "description": "A component that displays data in a structured table format that automatically adapts to the available space.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "variant", "value": "\"auto\" | \"list\"", - "description": "The layout variant of the table component.\n\n- `list`: Always displays as a list layout.\n- `table`: Always displays as a traditional table layout.\n- `auto`: Automatically displays as a table on wide screens and as a list on narrow screens.", + "description": "The display variant of the table.", "defaultValue": "'auto'" }, { @@ -69346,7 +77708,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table. When `true`, the table might be in an inert state that prevents user interaction.", + "description": "Whether the table is currently in a loading state.", "defaultValue": "false" }, { @@ -69354,7 +77716,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paginate", "value": "boolean", - "description": "Whether to use pagination controls.", + "description": "Whether the pagination controls are displayed.", "defaultValue": "false" }, { @@ -69362,7 +77724,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hasPreviousPage", "value": "boolean", - "description": "Whether there's a previous page of data.", + "description": "Whether there's a previous page of data that the user can navigate to.", "defaultValue": "false" }, { @@ -69370,25 +77732,40 @@ "syntaxKind": "PropertyDeclaration", "name": "hasNextPage", "value": "boolean", - "description": "Whether there's an additional page of data.", + "description": "Whether there's a next page of data that the user can navigate to.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@actualTableVariantSymbol@12105", - "value": "AddedContext", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@actualTableVariantSymbol@17550", + "value": "_shopify_admin_web_component_foundations.AddedContext", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@tableHeadersSharedDataSymbol@12106", - "value": "AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", + "name": "__@tableHeadersSharedDataSymbol@17551", + "value": "_shopify_admin_web_component_foundations.AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -69434,7 +77811,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -69442,78 +77819,69 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Table extends PreactCustomElement implements TableProps {\n accessor variant: TableProps['variant'];\n accessor loading: TableProps['loading'];\n accessor paginate: TableProps['paginate'];\n accessor hasPreviousPage: TableProps['hasPreviousPage'];\n accessor hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" - }, - "AddedContext": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AddedContext", - "description": "", - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "T", - "description": "The current context value.\n\nThe new context value to set, which will notify all consumers." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "addEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", - "description": "The **`addEventListener()`** method of the EventTarget interface sets up a function that will be called whenever the specified event is delivered to the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener)" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "dispatchEvent", - "value": "(event: Event) => boolean", - "description": "The **`dispatchEvent()`** method of the EventTarget sends an Event to the object, (synchronously) invoking the affected event listeners in the appropriate order.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/dispatchEvent)" + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "removeEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", - "description": "The **`removeEventListener()`** method of the EventTarget interface removes an event listener previously registered with EventTarget.addEventListener() from the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/removeEventListener)" + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AddedContext extends EventTarget {\n constructor(defaultValue: T);\n /**\n * The current context value.\n */\n get value(): T;\n /**\n * The new context value to set, which will notify all consumers.\n */\n set value(value: T);\n}" + "value": "declare class Table extends PolarisCustomElement implements TableProps {\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The display variant of the table.\n */\n variant: TableProps['variant'];\n /**\n * Whether the table is currently in a loading state.\n */\n loading: TableProps['loading'];\n /**\n * Whether the pagination controls are displayed.\n */\n paginate: TableProps['paginate'];\n /**\n * Whether there's a previous page of data that the user can navigate to.\n */\n hasPreviousPage: TableProps['hasPreviousPage'];\n /**\n * Whether there's a next page of data that the user can navigate to.\n */\n hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: _shopify_admin_web_component_foundations.AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: _shopify_admin_web_component_foundations.AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" }, "ActualTableVariant": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ActualTableVariant", "value": "'table' | 'list'", - "description": "Represents the actual rendered variant of a table component.\n- `table`: Displays as a traditional table layout.\n- `list`: Displays as a list layout.", - "isPublicDocs": true + "description": "" }, "ListSlotType": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ListSlotType", "value": "'primary' | 'secondary' | 'kicker' | 'inline' | 'labeled'", - "description": "Represents the semantic type of content slots within list items.\n\n- `primary`: The main content or title of the list item.\n- `secondary`: Supporting or descriptive content below the primary content.\n- `kicker`: A small label or tag displayed above the primary content.\n- `inline`: Content displayed inline with the primary content.\n- `labeled`: Content with an associated label.", - "isPublicDocs": true + "description": "" }, "HeaderFormat": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true }, "TableBody": { "filePath": "src/surfaces/admin/components.ts", "name": "TableBody", - "description": "The table body component represents the main content area of a table, containing the data rows. Use table body as a child of table to structure your table data, with each table row within the body representing a single record or entry.\n\nTable body must contain table row components, which in turn contain table cell components for the actual data values.", - "isPublicDocs": true, + "description": "A component that wraps the body content of a table, which contains the data rows.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -69559,7 +77927,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -69567,26 +77935,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableBody extends PreactCustomElement implements TableBodyProps {\n constructor();\n}" + "value": "declare class TableBody extends PolarisCustomElement implements TableBodyProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n}" }, "TableCell": { "filePath": "src/surfaces/admin/components.ts", "name": "TableCell", - "description": "The table cell component represents a single data cell within a table row. Use table cell as a child of table row to display individual data values, with each cell corresponding to a column in the table.\n\nTable cell automatically inherits styling and alignment from its parent table structure and supports text content or other inline components.", - "isPublicDocs": true, + "description": "A component that represents a single cell in a table row, which displays data in a format that's determined by its column header.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", - "name": "__@headerFormatSymbol@12128", + "name": "__@headerFormatSymbol@17578", "value": "HeaderFormat", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -69632,7 +78029,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -69640,24 +78037,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableCell extends PreactCustomElement implements TableCellProps {\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" + "value": "declare class TableCell extends PolarisCustomElement implements TableCellProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" }, "TableHeader": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeader", - "description": "The table header component represents a single column header within a table header row. Use table header as a child of table header row to define column headings and optionally enable column sorting.\n\nTable header provides semantic meaning for screen readers and can include sorting controls when configured. Each header corresponds to a column in the table body.", - "isPublicDocs": true, + "description": "A component that defines a column header in a table, which specifies both the header label and how the column's data should be formatted.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "listSlot", "value": "ListSlotType", - "description": "The content designation for this column when the table displays in list variant on mobile devices.", + "description": "The slot where this header's data appears when the table is shown in list view.", "defaultValue": "'labeled'" }, { @@ -69665,7 +78076,22 @@ "syntaxKind": "PropertyDeclaration", "name": "format", "value": "HeaderFormat", - "description": "The format of the column that controls styling and alignment of cell content." + "description": "The format of the header and its corresponding cells." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -69712,7 +78138,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -69720,17 +78146,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeader\n extends PreactCustomElement\n implements TableHeaderProps\n{\n accessor listSlot: TableHeaderProps['listSlot'];\n accessor format: TableHeaderProps['format'];\n constructor();\n}" + "value": "declare class TableHeader\n extends PolarisCustomElement\n implements TableHeaderProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The slot where this header's data appears when the table is shown in list view.\n */\n listSlot: TableHeaderProps['listSlot'];\n /**\n * The format of the header and its corresponding cells.\n */\n format: TableHeaderProps['format'];\n constructor();\n}" }, "TableHeaderRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeaderRow", - "description": "The table header row component represents the header row of a table, containing column headings. Use table header row as the first child of table (before table body) to define the table structure and provide column labels.\n\nTable header row must contain table header components for each column. These headers provide context for the data columns and can support sorting functionality.", - "isPublicDocs": true, + "description": "A component that wraps the header row of a table, which contains the table header components that define the column structure.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -69748,6 +78188,21 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -69777,7 +78232,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -69785,24 +78240,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeaderRow\n extends PreactCustomElement\n implements TableHeaderRowProps\n{\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class TableHeaderRow\n extends PolarisCustomElement\n implements TableHeaderRowProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "TableRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableRow", - "description": "The table row component represents a single row of data within a table body. Use table row as a child of table body to structure individual records or entries in the table.\n\nTable row must contain table cell components, with each cell representing a data value for the corresponding column. The number of cells should match the number of headers in the table.", - "isPublicDocs": true, + "description": "A component that represents a single row in a table, which contains the data cells.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "clickDelegate", "value": "string", - "description": "The ID of an interactive element, such as `s-link`, in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally." + "description": "A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -69849,7 +78333,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -69857,24 +78341,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableRow extends PreactCustomElement implements TableRowProps {\n constructor();\n accessor clickDelegate: string;\n}" + "value": "declare class TableRow extends PolarisCustomElement implements TableRowProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /**\n * A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector.\n */\n clickDelegate: string;\n}" }, "TextArea": { "filePath": "src/surfaces/admin/components.ts", "name": "TextArea", - "description": "Configure the following properties on the text area component.", - "isPublicDocs": true, + "description": "The text area custom element class that renders a multi-line text input field in the Shopify admin interface. This component allows merchants to enter and edit longer text content with support for labels, validation, and length constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -69882,7 +78380,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, { @@ -69890,22 +78388,15 @@ "syntaxKind": "PropertyDeclaration", "name": "rows", "value": "number", - "description": "A number of visible text lines.", + "description": "The number of visible text lines for the field, controlling its initial height.", "defaultValue": "2" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -69913,35 +78404,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -69949,14 +78440,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -69964,7 +78455,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -69988,7 +78479,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -70012,7 +78503,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -70020,23 +78511,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -70074,7 +78579,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -70082,24 +78587,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextArea\n extends PreactFieldElement\n implements TextAreaProps\n{\n accessor maxLength: TextAreaProps['maxLength'];\n accessor minLength: TextAreaProps['minLength'];\n accessor rows: TextAreaProps['rows'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextArea extends TextAreaBase implements TextAreaProps {\n constructor();\n}" }, "TextField": { "filePath": "src/surfaces/admin/components.ts", "name": "TextField", - "description": "Configure the following properties on the text field component.", - "isPublicDocs": true, + "description": "The text field custom element class that renders a single-line text input field in the Shopify admin interface. This component allows merchants to enter and edit text with support for labels, validation, icons, and prefix/suffix content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\" | AnyString", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "value": "IconType | AnyString", + "description": "An icon to display at the start of the text field, providing visual context for the input. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", "defaultValue": "''" }, { @@ -70107,7 +78626,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the merchant can enter in the field. When this limit is reached, the field prevents further input.", "defaultValue": "Infinity" }, { @@ -70115,7 +78634,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation. The field will be considered invalid if the merchant enters fewer characters than this value.", "defaultValue": "0" }, { @@ -70123,7 +78642,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the merchant's input, such as a currency symbol (`$`) or protocol (`https://`).", "defaultValue": "''" }, { @@ -70131,22 +78650,15 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the merchant's input, such as a unit of measurement (`kg`, `%`) or domain (`.myshopify.com`).", "defaultValue": "''" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -70154,35 +78666,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -70190,14 +78702,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -70205,7 +78717,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -70229,7 +78741,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -70253,7 +78765,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -70261,23 +78773,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -70315,7 +78841,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -70323,41 +78849,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextField\n extends PreactFieldElement\n implements TextFieldProps\n{\n accessor icon: TextFieldProps['icon'];\n accessor maxLength: TextFieldProps['maxLength'];\n accessor minLength: TextFieldProps['minLength'];\n accessor prefix: TextFieldProps['prefix'];\n accessor suffix: TextFieldProps['suffix'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextField extends TextFieldBase implements TextFieldProps {\n constructor();\n}" }, "Thumbnail": { "filePath": "src/surfaces/admin/components.ts", "name": "Thumbnail", - "description": "Configure the following properties on the thumbnail component.", - "isPublicDocs": true, + "description": "A thumbnail displays a small preview image with configurable sizing.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display in the thumbnail." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the product thumbnail image.\n\n- `small-200`: Smallest thumbnail size, ideal for compact product lists or tables.\n- `small-100`: Very small thumbnail, suitable for dense layouts.\n- `small`: Small thumbnail for space-constrained contexts.\n- `base`: Default size that balances visibility and space efficiency.\n- `large`: Larger thumbnail for featured products or detailed views.\n- `large-100`: Extra large thumbnail for prominent product display.", + "description": "The size of the thumbnail.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -70403,7 +78950,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -70411,22 +78958,36 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Thumbnail extends PreactCustomElement implements ThumbnailProps {\n accessor src: ThumbnailProps['src'];\n accessor alt: ThumbnailProps['alt'];\n accessor size: ThumbnailProps['size'];\n constructor();\n}" + "value": "declare class Thumbnail extends PolarisCustomElement implements ThumbnailProps {\n /**\n * The URL of the image to display in the thumbnail.\n */\n src: ThumbnailProps['src'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ThumbnailProps['alt'];\n /**\n * The size of the thumbnail.\n */\n size: ThumbnailProps['size'];\n constructor();\n}" }, "Tooltip": { "filePath": "src/surfaces/admin/components.ts", "name": "Tooltip", - "description": "Configure the following properties on the tooltip component.", - "isPublicDocs": true, + "description": "A component that displays a small popup with explanatory text when the user hovers over or focuses on an element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -70434,7 +78995,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -70442,11 +79003,104 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Tooltip extends PreactOverlayElement implements TooltipProps {\n constructor();\n}" + }, + "UnorderedList": { + "filePath": "src/surfaces/admin/components.ts", + "name": "UnorderedList", + "description": "A custom element for displaying a bulleted list of items where the order doesn't matter. Use unordered list when you have a collection of related items without a specific sequence, such as features, options, or bullet points.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -70492,7 +79146,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -70500,97 +79154,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - } - ], - "value": "declare class Tooltip extends PreactOverlayElement implements TooltipProps {\n constructor();\n}" - }, - "UnorderedList": { - "filePath": "src/surfaces/admin/components.ts", - "name": "UnorderedList", - "description": "Configure the following properties on the unordered list component.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "queueRender", + "name": "__@flushRenderSymbol@16092", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class UnorderedList\n extends PreactCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" + "value": "declare class UnorderedList\n extends PolarisCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" }, "URLField": { "filePath": "src/surfaces/admin/components.ts", "name": "URLField", - "description": "Configure the following properties on the URL field component.", - "isPublicDocs": true, + "description": "The URL field custom element class that renders a URL input field in the Shopify admin interface. This component allows merchants to enter web addresses with automatic URL validation and appropriate mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | `section-${string} url` | `section-${string} photo` | `section-${string} impp` | `section-${string} home impp` | `section-${string} mobile impp` | `section-${string} fax impp` | `section-${string} pager impp` | \"shipping url\" | \"shipping photo\" | \"shipping impp\" | \"shipping home impp\" | \"shipping mobile impp\" | \"shipping fax impp\" | \"shipping pager impp\" | \"billing url\" | \"billing photo\" | \"billing impp\" | \"billing home impp\" | \"billing mobile impp\" | \"billing fax impp\" | \"billing pager impp\" | `section-${string} shipping url` | `section-${string} shipping photo` | `section-${string} shipping impp` | `section-${string} shipping home impp` | `section-${string} shipping mobile impp` | `section-${string} shipping fax impp` | `section-${string} shipping pager impp` | `section-${string} billing url` | `section-${string} billing photo` | `section-${string} billing impp` | `section-${string} billing home impp` | `section-${string} billing mobile impp` | `section-${string} billing fax impp` | `section-${string} billing pager impp` | URLAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint about the intended content of the field for browser autofill.", + "defaultValue": "'url'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the URL.", "defaultValue": "Infinity" }, { @@ -70598,50 +79201,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the URL.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -70649,14 +79245,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -70664,7 +79260,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -70688,7 +79284,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -70712,7 +79308,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -70720,23 +79316,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -70774,7 +79384,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -70782,41 +79392,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class URLField\n extends PreactFieldElement\n implements URLFieldProps\n{\n accessor autocomplete: URLFieldProps['autocomplete'];\n accessor maxLength: URLFieldProps['maxLength'];\n accessor minLength: URLFieldProps['minLength'];\n /**\n * The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class URLField extends URLFieldBase implements URLFieldProps {\n constructor();\n}" }, "URLAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "URLAutocompleteField", "value": "'url' | 'photo' | 'impp' | 'home impp' | 'mobile impp' | 'fax impp' | 'pager impp'", - "description": "Represents autocomplete values that are valid for URL input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for URL inputs.\n\nAvailable values:\n- `url` - General URL or web address\n- `photo` - URL to a photo or image\n- `impp` - Instant messaging protocol URL\n- `home impp` - Home instant messaging protocol URL\n- `mobile impp` - Mobile instant messaging protocol URL\n- `fax impp` - Fax instant messaging protocol URL\n- `pager impp` - Pager instant messaging protocol URL", - "isPublicDocs": true + "description": "" }, "AdminAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminAction", - "description": "Configure the following properties on the admin action component.", - "isPublicDocs": true, + "description": "The admin action custom element class that renders action controls in the Shopify admin interface. This component creates a standardized action area with a heading and slots for primary and secondary action buttons, used exclusively in admin action extensions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text to use as the Action modal's title. If not provided, the name of the extension will be used." + "description": "The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the action is in a loading state, such as during initial page load or when the action is being opened. When `true`, the action might be in an inert state that prevents user interaction.", + "description": "Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -70862,7 +79492,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -70870,11 +79500,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminAction\n extends PreactCustomElement\n implements AdminActionProps\n{\n /**\n * The text to use as the Action modal's title. If not provided, the name of the extension will be used.\n */\n heading: string;\n /**\n * Whether the action is in a loading state, such as during initial page load or when the action is being opened.\n * When `true`, the action might be in an inert state that prevents user interaction.\n */\n loading: boolean;\n constructor();\n}" + "value": "declare class AdminAction\n extends PolarisCustomElement\n implements AdminActionProps\n{\n /**\n * The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading.\n */\n heading: string;\n /**\n * Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.\n *\n * @default false\n */\n loading: boolean;\n constructor();\n}" }, "RunnableExtension": { "filePath": "src/extension.ts", @@ -71087,22 +79732,28 @@ "AdminBlock": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminBlock", - "description": "Configure the following properties on the admin block component.", - "isPublicDocs": true, + "description": "The admin block custom element class that renders a collapsible content block in the Shopify admin interface. This component organizes content into expandable sections with headings and provides a summary when collapsed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text displayed as the block's title in the header. If not provided, the extension name will be used." + "description": "The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "collapsedSummary", "value": "string", - "description": "The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated." + "description": "The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -71149,7 +79800,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -71157,18 +79808,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminBlock\n extends PreactCustomElement\n implements AdminBlockProps\n{\n /**\n * The text displayed as the block's title in the header. If not provided, the extension name will be used.\n */\n heading: string;\n /**\n * The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated.\n */\n collapsedSummary: string;\n constructor();\n}" + "value": "declare class AdminBlock\n extends PolarisCustomElement\n implements AdminBlockProps\n{\n /**\n * The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed.\n */\n heading: string;\n /**\n * The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed.\n */\n collapsedSummary: string;\n constructor();\n}" }, "Form": { "filePath": "src/surfaces/admin/components.ts", "name": "Form", - "description": "Configure the following properties on the form component.", - "isPublicDocs": true, + "description": "The form custom element class that renders a form container in the Shopify admin interface. This component manages form submission, validation, and reset behavior for collecting merchant input.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -71214,7 +79886,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -71222,11 +79894,114 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Form extends PreactCustomElement implements FormProps {\n constructor();\n}" + "value": "declare class Form extends PolarisCustomElement implements FormProps {\n constructor();\n}" + }, + "IntentRenderApi": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderApi", + "description": "The `IntentRenderApi` object provides methods for extensions that render in response to an app intent. Access the intent data to determine what action the merchant requested and use `intents.response` to resolve the intent when complete.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "auth", + "value": "Auth", + "description": "Provides methods for authenticating calls to your app backend. Use the `idToken()` method to retrieve a signed JWT token that verifies the current user's identity for secure server-side operations." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "extension", + "value": "{ target: ExtensionTarget; }", + "description": "The identifier of the running extension target. Use this to determine which target your extension is rendering in and conditionally adjust functionality or UI based on the extension context." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "i18n", + "value": "I18n", + "description": "Utilities for translating content according to the current localization of the admin. Use these methods to provide translated strings that match the merchant's language preferences, ensuring your extension is accessible to a global audience." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "intents", + "value": "IntentRenderIntents", + "description": "Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "picker", + "value": "PickerApi", + "description": "Opens a custom selection dialog with your app-specific data. Use the [Picker API](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/picker-api) to define the picker's heading, items, headers, and selection behavior. Returns a Promise that resolves to a `Picker` object with a `selected` property for accessing the merchant's selection." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "query", + "value": "(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>", + "description": "Executes GraphQL queries against the [GraphQL Admin API](/docs/api/admin-graphql). Use this to fetch shop data, manage resources, or perform mutations. Queries are automatically authenticated with the current user's permissions. Optionally specify GraphQL variables and API version for your query." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "resourcePicker", + "value": "ResourcePickerApi", + "description": "Opens the [resource picker](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/resource-picker-api) modal for selecting products, variants, or collections. Returns the selected resources when the user confirms their selection, or undefined if they cancel." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "storage", + "value": "Storage", + "description": "Provides methods for persisting data in browser storage that is scoped to your extension. Use this to store user preferences, cache data, maintain state across sessions, or save temporary working data. Storage is persistent across page reloads and isolated per extension." + } + ], + "value": "export interface IntentRenderApi\n extends StandardRenderingExtensionApi {\n /**\n * Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow.\n */\n intents: IntentRenderIntents;\n}" + }, + "IntentRenderIntents": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderIntents", + "description": "The intents API available to intent render extensions. Unlike other targets where `response` is optional, intent render extensions always run inside an intent workflow so `response` is guaranteed.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled." + } + ], + "value": "export interface IntentRenderIntents {\n /**\n * Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled.\n */\n response: IntentResponseApi;\n}" + }, + "FormExtensionComponents": { + "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "FormExtensionComponents", + "value": "StandardComponents | 'Form'", + "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." }, "StandardApi": { "filePath": "src/surfaces/admin/api/standard/standard.ts", @@ -71880,19 +80655,18 @@ "value": "FormExtensionComponents | 'FunctionSettings'", "description": "The components available for building function settings extensions. Includes all form components plus the function settings component required for function settings configuration." }, - "FormExtensionComponents": { - "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "FormExtensionComponents", - "value": "StandardComponents | 'Form'", - "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." - }, "FunctionSettings": { "filePath": "src/surfaces/admin/components.ts", "name": "FunctionSettings", - "description": "Configure the following properties on the function settings component.", - "isPublicDocs": true, + "description": "The function settings custom element class that renders a specialized form for configuring Shopify Function settings in the admin interface. This component manages function configuration submission, validation, and error handling.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -71938,7 +80712,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -71946,8 +80720,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class FunctionSettings\n extends PreactCustomElement\n implements FunctionSettingsProps\n{\n constructor();\n}" @@ -72034,15 +80823,21 @@ "AdminPrintAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminPrintAction", - "description": "Configure the following properties on the admin print action component.", - "isPublicDocs": true, + "description": "The admin print action custom element class that renders a print interface in the Shopify admin. This component enables merchants to print content from a specified source URL using the browser's print functionality.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The `src` URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs, and images are supported." + "description": "The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -72089,7 +80884,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -72097,11 +80892,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminPrintAction\n extends PreactCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The `src` URL of the preview and the document to print.\n * If not provided, the preview will show an empty state and the print button will be disabled.\n * HTML, PDFs, and images are supported.\n */\n src: string;\n constructor();\n}" + "value": "declare class AdminPrintAction\n extends PolarisCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action.\n */\n src: string;\n constructor();\n}" }, "PurchaseOptionsCardConfigurationApi": { "filePath": "src/surfaces/admin/api/purchase-options-card-action.ts", @@ -73008,32 +81818,31 @@ "Text": { "filePath": "src/surfaces/admin/components.ts", "name": "Text", - "description": "Configure the following properties on the text component.", - "isPublicDocs": true, + "description": "A custom element for displaying inline or small blocks of text with various visual styles and semantic meanings. Use Text to render short pieces of content with appropriate styling, emphasis, and color treatment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color of the text.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", @@ -73048,7 +81857,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -73056,7 +81865,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, { @@ -73064,7 +81873,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The ID of an element this text provides contextual information for." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -73111,7 +81927,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -73119,17 +81935,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Text extends PreactCustomElement implements TextProps {\n accessor fontVariantNumeric: TextProps['fontVariantNumeric'];\n accessor color: TextProps['color'];\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: TextProps['tone'];\n /**\n * The semantic type and styling treatment for the text content.\n *\n * - `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n * - `generic`: Standard text with no special semantic meaning or styling.\n * - `address`: Marks the text as contact information, such as a physical or email address.\n * - `redundant`: Indicates the text is redundant or duplicated information for screen reader context.\n */\n accessor type: TextProps['type'];\n accessor dir: TextProps['dir'];\n accessor accessibilityVisibility: TextProps['accessibilityVisibility'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Text extends TextBase implements TextProps {\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: TextProps['tone'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -73152,31 +81982,31 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred." + "description": "" } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" }, "ExtensionTarget": { "filePath": "src/surfaces/admin/extension-targets.ts", @@ -73212,6 +82042,13 @@ "value": "RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >", "description": "A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options." }, + { + "filePath": "src/surfaces/admin/extension-targets.ts", + "syntaxKind": "PropertySignature", + "name": "admin.app.intent.render", + "value": "RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >", + "description": "Renders an admin extension for handling app intents." + }, { "filePath": "src/surfaces/admin/extension-targets.ts", "syntaxKind": "PropertySignature", @@ -73739,7 +82576,7 @@ "description": "A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules." } ], - "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n}" + "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n\n /**\n * Renders an admin extension for handling app intents.\n */\n 'admin.app.intent.render': RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >;\n}" }, "RenderExtension": { "filePath": "src/extension.ts", @@ -73913,9 +82750,17 @@ "value": "string | URL", "description": "The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.", + "isOptional": true } ], - "value": "export interface Intents {\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" + "value": "export interface Intents {\n /**\n * Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.\n */\n response?: IntentResponseApi;\n\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" }, "IntentInvokeApi": { "filePath": "src/surfaces/admin/api/intents/intents.ts", @@ -73925,6 +82770,67 @@ "members": [], "value": "export interface IntentInvokeApi {\n (query: IntentQuery): Promise;\n (intentURL: string, options?: IntentQueryOptions): Promise;\n}" }, + "IntentResponseApi": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "IntentResponseApi", + "description": "The `IntentResponseApi` object provides methods for resolving the current intent from within an invoked extension. This API is only present when your extension is running inside an intent workflow.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "closed", + "value": "() => Promise", + "description": "Resolves the current intent as closed without completing the workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "error", + "value": "(message: string, issues?: Issue[]) => Promise", + "description": "Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "ok", + "value": "(data?: { [key: string]: unknown; }) => Promise", + "description": "Resolves the current intent successfully. Pass output data when your intent defines a response schema." + } + ], + "value": "export interface IntentResponseApi {\n /**\n * Resolves the current intent successfully. Pass output data when your intent defines a response schema.\n */\n ok(data?: SuccessIntentResponse['data']): Promise;\n\n /**\n * Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available.\n */\n error(message: string, issues?: Issue[]): Promise;\n\n /**\n * Resolves the current intent as closed without completing the workflow.\n */\n closed(): Promise;\n}" + }, + "Issue": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "Issue", + "description": "A structured issue describing a validation or workflow error.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "code", + "value": "string", + "description": "A machine-readable error code for this issue. Use this for programmatic error handling or logging.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "message", + "value": "string", + "description": "A description of what's wrong with this field. Display this to help merchants understand how to fix the error.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "path", + "value": "string[]", + "description": "The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure.", + "isOptional": true + } + ], + "value": "export interface Issue {\n /** The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure. */\n path?: string[];\n /** A description of what's wrong with this field. Display this to help merchants understand how to fix the error. */\n message?: string;\n /** A machine-readable error code for this issue. Use this for programmatic error handling or logging. */\n code?: string;\n}" + }, "PickerApi": { "filePath": "src/surfaces/admin/api/picker/picker.ts", "name": "PickerApi", @@ -74418,29 +83324,28 @@ "Avatar": { "filePath": "src/surfaces/admin/components.ts", "name": "Avatar", - "description": "Configure the following properties on the avatar component.", - "isPublicDocs": true, + "description": "An avatar displays a user or entity image with fallback initials when the image isn't available.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "initials", "value": "string", - "description": "The initials to display in the avatar when no image is provided or fails to load. Typically one or two characters representing a person's first and last name initials, such as \"JD\" for John Doe." + "description": "The initials to display when no image is provided or if the image fails to load." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The URL or path to the avatar image. When provided, the image takes priority over `initials`. If the image fails to load or loads slowly, `initials` will be rendered as a fallback." + "description": "The URL of the avatar image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"base\" | \"large\" | \"large-200\"", - "description": "The size of the avatar image.\n\n- `small-200`: Extra small avatar, suitable for compact displays or lists with many items.\n- `small`: Small avatar, good for secondary contexts or tight layouts.\n- `base`: Default size that works well in most contexts.\n- `large`: Large avatar for emphasis or when the avatar is a focal point.\n- `large-200`: Extra large avatar for prominent display.", + "description": "The size of the avatar.", "defaultValue": "'base'" }, { @@ -74448,7 +83353,14 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the avatar for accessibility.\n\nProvides a text description of the avatar for users with assistive technology and serves as a fallback when the avatar fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an avatar, it reads this description aloud. When an avatar fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt)." + "description": "Alternative text that describes the avatar for screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -74495,7 +83407,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -74503,48 +83415,70 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Avatar extends PreactCustomElement implements AvatarProps {\n accessor initials: AvatarProps['initials'];\n accessor src: AvatarProps['src'];\n accessor size: AvatarProps['size'];\n accessor alt: AvatarProps['alt'];\n constructor();\n}" + "value": "declare class Avatar extends PolarisCustomElement implements AvatarProps {\n /**\n * The initials to display when no image is provided or if the image fails to load.\n */\n initials: AvatarProps['initials'];\n /**\n * The URL of the avatar image to display.\n */\n src: AvatarProps['src'];\n /**\n * The size of the avatar.\n */\n size: AvatarProps['size'];\n /**\n * Alternative text that describes the avatar for screen readers.\n */\n alt: AvatarProps['alt'];\n constructor();\n}" }, "Badge": { "filePath": "src/surfaces/admin/components.ts", "name": "Badge", - "description": "Configure the following properties on the badge component.", - "isPublicDocs": true, + "description": "The badge custom element class that renders status indicators in the Shopify admin interface. This component displays compact visual indicators with customizable tones, sizes, and optional icons to communicate status information to merchants.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"strong\"", - "description": "Controls the visual weight and emphasis of the badge.\n\n- `base`: Standard weight with moderate emphasis, suitable for most use cases.\n- `strong`: Increased visual weight for higher emphasis and prominence.", - "defaultValue": "'base'" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the badge to provide additional visual context or reinforce the badge's meaning. Accepts any icon name from the icon library or a custom string identifier." + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"strong\"", + "description": "The visual weight of the badge. Available options: `'base'` for standard weight or `'strong'` for increased emphasis.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the badge.\n\n- `base`: Default size suitable for most badge use cases.\n- `large`: Larger badge for increased visibility and prominence.\n- `large-100`: Extra large badge for maximum visibility in emphasized contexts.", + "description": "The size of the badge. Available options: `'base'` for standard size, `'large'` for larger size, or `'large-100'` for extra large size.", "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", - "defaultValue": "'auto'" + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -74591,7 +83525,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -74599,17 +83533,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Badge extends PreactCustomElement implements BadgeProps {\n accessor color: BadgeProps['color'];\n accessor icon: BadgeProps['icon'];\n accessor size: BadgeProps['size'];\n accessor tone: BadgeProps['tone'];\n constructor();\n}" + "value": "declare class Badge extends BadgeBase implements BadgeProps {\n /**\n * The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: BadgeProps['icon'];\n /**\n * The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.\n */\n tone: BadgeProps['tone'];\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "Banner": { "filePath": "src/surfaces/admin/components.ts", "name": "Banner", - "description": "Configure the following properties on the banner component.", - "isPublicDocs": true, + "description": "A custom element for displaying important messages and notifications.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -74624,7 +83579,7 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.", + "description": "The color tone of the banner based on its semantic meaning.", "defaultValue": "'auto'" }, { @@ -74632,7 +83587,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Controls whether the banner is visible or hidden.\n\nWhen using a controlled component pattern and the banner is `dismissible`, update this property to `true` when the `dismiss` event fires.\n\nYou can hide the banner programmatically by setting this to `true` even if it's not `dismissible`.", + "description": "Whether the banner is hidden from view.", "defaultValue": "false" }, { @@ -74640,9 +83595,16 @@ "syntaxKind": "PropertyDeclaration", "name": "dismissible", "value": "boolean", - "description": "Whether the banner displays a close button that allows users to dismiss it.\n\nWhen the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, any animation completes, and the `afterhide` event fires.", + "description": "Whether the banner can be dismissed by the user.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -74688,7 +83650,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -74696,24 +83658,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Banner extends PreactCustomElement implements BannerProps {\n accessor heading: BannerProps['heading'];\n accessor tone: BannerProps['tone'];\n accessor hidden: BannerProps['hidden'];\n accessor dismissible: BannerProps['dismissible'];\n constructor();\n}" + "value": "declare class Banner extends PolarisCustomElement implements BannerProps {\n /**\n * The heading text displayed at the top of the banner.\n */\n heading: BannerProps['heading'];\n /**\n * The color tone of the banner based on its semantic meaning.\n */\n tone: BannerProps['tone'];\n /**\n * Whether the banner is hidden from view.\n */\n hidden: BannerProps['hidden'];\n /**\n * Whether the banner can be dismissed by the user.\n */\n dismissible: BannerProps['dismissible'];\n constructor();\n}" }, "Box": { "filePath": "src/surfaces/admin/components.ts", "name": "Box", - "description": "Configure the following properties on the box component.", - "isPublicDocs": true, + "description": "A box is a container component that provides control over layout, spacing, and styling.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -74721,7 +83697,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -74729,7 +83705,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -74737,7 +83713,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -74745,7 +83721,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -74753,7 +83729,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -74761,7 +83737,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -74769,7 +83745,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -74777,7 +83753,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -74785,7 +83761,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -74793,7 +83769,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -74801,7 +83777,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -74809,7 +83785,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -74817,7 +83793,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -74825,7 +83801,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -74833,7 +83809,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -74841,7 +83817,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -74861,7 +83837,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -74869,7 +83845,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -74877,7 +83853,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -74885,7 +83861,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -74893,14 +83869,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -74908,9 +83884,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -74956,7 +83939,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -74964,8 +83947,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Box extends BoxElement implements BoxProps {\n constructor();\n}" @@ -74974,120 +83972,106 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -75095,60 +84079,60 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "Button": { "filePath": "src/surfaces/admin/components.ts", "name": "Button", - "description": "Configure the following properties on the button component.", - "isPublicDocs": true, + "description": "The button custom element class that renders interactive buttons in the Shopify admin interface. This component triggers actions or navigation when clicked, with customizable visual styles, states, and optional icons.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", - "defaultValue": "false" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier." + "name": "variant", + "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", + "description": "The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.", + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "loading", - "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", - "defaultValue": "false" + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "variant", - "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "defaultValue": "'auto'" + "name": "disabled", + "value": "boolean", + "description": "Whether the button is disabled, preventing any interaction. When `true`, the button appears visually disabled and doesn't respond to user clicks.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" + "name": "loading", + "value": "boolean", + "description": "Whether the button is in a loading state. When `true`, displays a loading indicator and prevents interaction to show that an action is in progress.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to open the linked document when the button acts as a link. Available options: `''`, `'_blank'`, `'_self'`, `'_parent'`, or `'_top'`.", "defaultValue": "'auto'" }, { @@ -75156,21 +84140,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "A URL that the button should navigate to when clicked. When provided, the button behaves as a link." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Prompts the user to save the linked URL as a file with the specified filename. Only works when `href` is provided." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The button's behavior in forms. Available options: `'button'`, `'submit'`, or `'reset'`.", "defaultValue": "'button'" }, { @@ -75178,7 +84162,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the button's purpose for screen readers. This is essential for accessibility when the button doesn't have visible text." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "inlineSize", + "value": "\"auto\" | \"fill\" | \"fit-content\"", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -75225,7 +84224,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -75233,15 +84232,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -75249,38 +84263,36 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Button extends Button_base implements ButtonProps {\n accessor disabled: ButtonProps['disabled'];\n accessor icon: ButtonProps['icon'];\n accessor loading: ButtonProps['loading'];\n accessor variant: ButtonProps['variant'];\n accessor tone: ButtonProps['tone'];\n accessor target: ButtonProps['target'];\n accessor href: ButtonProps['href'];\n accessor download: ButtonProps['download'];\n accessor type: ButtonProps['type'];\n accessor accessibilityLabel: ButtonProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Button\n extends ButtonBase\n implements ButtonProps\n{\n /**\n * The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: ButtonProps['icon'];\n /**\n * The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.\n */\n variant: ButtonProps['variant'];\n /**\n * The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.\n */\n tone: ButtonProps['tone'];\n constructor();\n}" }, "AnyString": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AnyString", "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true + "description": "Prevents widening string literal types in a union to `string`." }, "ButtonGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "ButtonGroup", - "description": "Configure the following properties on the button group component.", - "isPublicDocs": true, + "description": "A button group that arranges multiple buttons together with consistent spacing and semantic grouping for related actions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "\"base\" | \"none\"", - "description": "The spacing between buttons in the group.\n\n- `base`: Standard spacing that provides clear visual separation between buttons.\n- `none`: No spacing, creating a connected button group.", + "description": "The amount of spacing between buttons in the group, affecting the visual separation of actions.", "defaultValue": "'base'" }, { @@ -75288,7 +84300,21 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, describing the purpose of this group of buttons." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -75314,14 +84340,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -75335,7 +84353,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -75343,39 +84361,68 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ButtonGroup\n extends PreactCustomElement\n implements ButtonGroupProps\n{\n accessor gap: ButtonGroupProps['gap'];\n accessor accessibilityLabel: ButtonGroupProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class ButtonGroup extends ButtonGroupBase implements ButtonGroupProps {\n constructor();\n}" }, "Checkbox": { "filePath": "src/surfaces/admin/components.ts", "name": "Checkbox", - "description": "Configure the following properties on the checkbox component.", - "isPublicDocs": true, + "description": "A checkbox that lets users select or deselect an option, with support for an indeterminate state.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "indeterminate", "value": "boolean", - "description": "Whether the checkbox displays in an indeterminate state (neither checked nor unchecked), typically used to indicate partial selection in hierarchical lists.\n\nThis visual state takes priority over the `checked` prop in appearance only. The form submission value is still determined by the `checked` prop.\n\nIf `indeterminate` has not been explicitly set and hasn't been modified by user interaction, it returns the value of `defaultIndeterminate`." + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultIndeterminate", "value": "boolean", - "description": "The initial indeterminate state for uncontrolled components. Use this when you want the checkbox to start in an indeterminate state but don't need to control it afterward.\n\nThis value applies until `indeterminate` is explicitly set or the user changes the checkbox state by clicking.", + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "labelAccessibilityVisibility", + "value": "\"visible\" | \"exclusive\"", + "description": "", + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -75390,7 +84437,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -75398,28 +84445,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -75442,7 +84489,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -75450,23 +84497,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -75512,7 +84566,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -75520,24 +84574,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Checkbox extends PreactCheckboxElement implements CheckboxProps {\n get indeterminate(): CheckboxProps['indeterminate'];\n set indeterminate(indeterminate: CheckboxProps['indeterminate']);\n accessor defaultIndeterminate: CheckboxProps['defaultIndeterminate'];\n constructor();\n}" + "value": "declare class Checkbox extends CheckboxBase implements CheckboxProps {\n constructor();\n}" + }, + "CallbackEvent": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CallbackEvent", + "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." }, "Chip": { "filePath": "src/surfaces/admin/components.ts", "name": "Chip", - "description": "Configure the following properties on the chip component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "Modify the color to be more or less intense.", "defaultValue": "'base'" }, { @@ -75545,7 +84620,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -75592,7 +84682,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -75600,24 +84690,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Chip extends PreactCustomElement implements ChipProps {\n accessor color: ChipProps['color'];\n accessor accessibilityLabel: ChipProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Chip extends PolarisCustomElement implements ChipProps {\n color: ChipProps['color'];\n accessibilityLabel: ChipProps['accessibilityLabel'];\n removable: ChipProps['removable'];\n constructor(renderImpl?: Omit);\n}" }, "Choice": { "filePath": "src/surfaces/admin/components.ts", "name": "Choice", - "description": "The choice component creates individual selectable options within a choice list. Use choice to define each option that merchants can select, supporting both single selection (radio buttons) and multiple selection (checkboxes) modes.\n\nChoice components support labels, help text, and custom content through slots, providing flexible option presentation within choice lists.", - "isPublicDocs": true, + "description": "A single choice within a choice list that can be selected with a radio button or checkbox.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the choice is disabled and can't be selected.", "defaultValue": "false" }, { @@ -75625,7 +84729,7 @@ "syntaxKind": "GetAccessor", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the choice is currently selected.", "defaultValue": "false" }, { @@ -75633,21 +84737,21 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this choice is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, used when the visual label isn't descriptive enough." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the choice should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -75666,6 +84770,13 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -75695,7 +84806,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -75703,24 +84814,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Choice extends PreactCustomElement implements ChoiceProps {\n accessor disabled: ChoiceProps['disabled'];\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n accessor value: ChoiceProps['value'];\n accessor accessibilityLabel: ChoiceProps['accessibilityLabel'];\n accessor defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Choice extends PolarisCustomElement implements ChoiceProps {\n /**\n * Whether the choice is disabled and can't be selected.\n */\n disabled: ChoiceProps['disabled'];\n /**\n * Whether the choice is currently selected.\n */\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n /**\n * The value that's submitted with the form when this choice is selected.\n */\n value: ChoiceProps['value'];\n /**\n * A label that's only visible to screen readers, used when the visual label isn't descriptive enough.\n */\n accessibilityLabel: ChoiceProps['accessibilityLabel'];\n /**\n * Whether the choice should be selected when it's first rendered.\n */\n defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ChoiceList": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceList", - "description": "Configure the following properties on the choice list component.", - "isPublicDocs": true, + "description": "A list of choices that lets users select one or more options using radio buttons or checkboxes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "addEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", + "description": "Wraps change and input event listeners so they only fire when the event was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n\nThis prevents form events from elements inside secondary content (e.g. TextField, native ) from being mistakenly treated as ChoiceList value-change events, while still allowing those events to bubble normally through the DOM (preserving React's event delegation).", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "removeEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction. When `true`, the `disabled` property on any child choices is ignored.", + "description": "Whether all choices in the list are disabled and can't be selected.", "defaultValue": "false" }, { @@ -75728,43 +84869,43 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name that identifies this choice list when the form is submitted." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the choice list when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the choice list." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "multiple", "value": "boolean", - "description": "Whether multiple choices can be selected.", + "description": "Whether users can select more than one choice at a time.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the choice list is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -75772,7 +84913,7 @@ "syntaxKind": "GetAccessor", "name": "values", "value": "string[]", - "description": "An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected." + "description": "The values of the currently selected choices." }, { "filePath": "src/surfaces/admin/components.ts", @@ -75801,11 +84942,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$3@11434", + "name": "__@internals$3@16769", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -75835,7 +84983,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -75843,38 +84991,52 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ChoiceList extends BaseClass$3 implements ChoiceListProps {\n accessor disabled: ChoiceListProps['disabled'];\n accessor name: ChoiceListProps['name'];\n accessor error: ChoiceListProps['error'];\n accessor details: ChoiceListProps['details'];\n accessor multiple: ChoiceListProps['multiple'];\n accessor label: ChoiceListProps['label'];\n accessor labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class ChoiceList extends BaseClass$1 implements ChoiceListProps {\n /**\n * Wraps change and input event listeners so they only fire when the event\n * was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n *\n * This prevents form events from elements inside secondary content (e.g.\n * TextField, native ) from being mistakenly treated as ChoiceList\n * value-change events, while still allowing those events to bubble normally\n * through the DOM (preserving React's event delegation).\n * @private\n */\n addEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n\n /** @private */\n removeEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: EventListenerOptions | boolean,\n ): void;\n\n /**\n * Whether all choices in the list are disabled and can't be selected.\n */\n disabled: ChoiceListProps['disabled'];\n /**\n * The name that identifies this choice list when the form is submitted.\n */\n name: ChoiceListProps['name'];\n /**\n * An error message that's displayed below the choice list when validation fails.\n */\n error: ChoiceListProps['error'];\n /**\n * Additional text to provide context or guidance for the choice list.\n */\n details: ChoiceListProps['details'];\n /**\n * Whether users can select more than one choice at a time.\n */\n multiple: ChoiceListProps['multiple'];\n /**\n * The text that describes what the choice list is for.\n */\n label: ChoiceListProps['label'];\n /**\n * Controls whether the label is visible to all users or only to screen readers.\n */\n labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n /**\n * The values of the currently selected choices.\n */\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "Clickable": { "filePath": "src/surfaces/admin/components.ts", "name": "Clickable", - "description": "Configure the following properties on the clickable component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the component is disabled, preventing clicks and focus. When disabled, the `click` event won't fire and click events from child elements stop propagating immediately. Interactive child elements can still receive focus and be interacted with. This doesn't apply visual styling by default. You shouldapply disabled styling as needed." + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the component is in a loading state, which indicates to assistive technology that an action is in progress and prevents interaction." + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -75882,21 +85044,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "defaultValue": "'button'" }, { @@ -75904,7 +85066,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -75912,7 +85074,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -75920,7 +85082,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -75928,7 +85090,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -75936,7 +85098,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -75944,7 +85106,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -75952,7 +85114,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -75960,7 +85122,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -75968,7 +85130,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -75976,7 +85138,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -75984,7 +85146,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -75992,7 +85154,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -76000,7 +85162,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -76008,7 +85170,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -76016,7 +85178,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -76024,7 +85186,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -76032,7 +85194,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -76052,7 +85214,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -76060,7 +85222,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -76068,7 +85230,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -76076,7 +85238,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -76084,14 +85246,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -76099,9 +85261,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -76147,7 +85316,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -76155,15 +85324,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -76171,30 +85355,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n accessor disabled: ClickableProps['disabled'];\n accessor loading: ClickableProps['loading'];\n accessor target: ClickableProps['target'];\n accessor href: ClickableProps['href'];\n accessor download: ClickableProps['download'];\n accessor type: ClickableProps['type'];\n constructor();\n}" + "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n disabled: ClickableProps['disabled'];\n loading: ClickableProps['loading'];\n target: ClickableProps['target'];\n href: ClickableProps['href'];\n download: ClickableProps['download'];\n type: ClickableProps['type'];\n constructor();\n}" }, "ClickableChip": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChip", - "description": "Configure the following properties on the clickable chip component.", - "isPublicDocs": true, + "description": "A custom element for displaying interactive chips that can be clicked or removed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "The color of the chip.", "defaultValue": "'base'" }, { @@ -76202,14 +85385,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the chip for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "removable", "value": "boolean", - "description": "Whether the chip displays a remove button for dismissal. When clicked, the `remove` callback fires.", + "description": "Whether the chip can be removed by the user.", "defaultValue": "false" }, { @@ -76217,7 +85400,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Whether the chip is hidden from view. When using controlled component pattern with `removable` chips, update this property when the `remove` event fires. For non-removable chips, manually toggle this property to show or hide the chip.", + "description": "Whether the chip is hidden from view.", "defaultValue": "false" }, { @@ -76225,7 +85408,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the chip is disabled, preventing any user interaction.", + "description": "Whether the chip is disabled and can't be clicked.", "defaultValue": "false" }, { @@ -76233,7 +85416,14 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to navigate to when the chip is clicked." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -76280,7 +85470,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -76288,15 +85478,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -76304,30 +85509,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class ClickableChip\n extends ClickableChip_base\n implements ClickableChipProps\n{\n accessor color: ClickableChipProps['color'];\n accessor accessibilityLabel: ClickableChipProps['accessibilityLabel'];\n accessor removable: ClickableChipProps['removable'];\n accessor hidden: ClickableChipProps['hidden'];\n accessor disabled: ClickableChipProps['disabled'];\n accessor href: ClickableChipProps['href'];\n constructor();\n}" + "value": "declare class ClickableChip\n extends ClickableChipBase\n implements ClickableChipProps\n{\n /**\n * The color of the chip.\n */\n color: ClickableChipProps['color'];\n constructor();\n}" }, "ColorField": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorField", - "description": "Configure the following properties on the color field component.", - "isPublicDocs": true, + "description": "The color field custom element class that renders a color input field with integrated visual picker in the Shopify admin interface. This component allows merchants to select colors by typing hex values or using an interactive color picker, with optional support for transparency (alpha channel).", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -76335,7 +85539,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", @@ -76358,7 +85562,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\"", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -76366,35 +85570,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -76402,14 +85606,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -76417,7 +85621,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -76441,7 +85645,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -76457,7 +85661,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -76465,23 +85669,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -76519,7 +85730,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -76527,24 +85738,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ColorField\n extends PreactFieldElement\n implements ColorFieldProps\n{\n accessor alpha: ColorFieldProps['alpha'];\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n setInternalValue(value: string, normalize: boolean): void;\n}" + "value": "declare class ColorField extends ColorFieldBase implements ColorFieldProps {\n constructor();\n}" }, "ColorPicker": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorPicker", - "description": "Configure the following properties on the color picker component.", - "isPublicDocs": true, + "description": "A visual color picker component that allows users to select colors from a color spectrum interface.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -76552,154 +85777,138 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial color value when the field first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts interacting, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", "name": "formResetCallback", "value": "() => void", - "description": "A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@internals$2@11535", - "value": "ElementInternals", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", "description": "", "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true } ], - "value": "declare class ColorPicker extends BaseClass$2 implements ColorPickerProps {\n accessor alpha: boolean;\n accessor name: string;\n accessor defaultValue: string;\n get value(): string;\n set value(value: string);\n /**\n * A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`.\n */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class ColorPicker extends BaseClass implements ColorPickerProps {\n /**\n * Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.\n *\n * @default false\n */\n alpha: boolean;\n /**\n * The name of the picker, used when submitting form data.\n */\n name: string;\n /**\n * The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n defaultValue: string;\n /**\n * The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n}" }, "DateField": { "filePath": "src/surfaces/admin/components.ts", "name": "DateField", - "description": "Configure the following properties on the date field component.", - "isPublicDocs": true, + "description": "The date field custom element class that renders a date input field with integrated calendar picker in the Shopify admin interface. This component allows merchants to select dates by typing or using a visual calendar, with support for date range restrictions and day-of-week constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar picker, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar picker first opens, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "DateAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -76707,36 +85916,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "defaultValue": "\"\"" + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -76744,14 +85952,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -76759,7 +85967,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -76783,7 +85991,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -76807,7 +86015,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -76815,31 +86023,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected date in `YYYY-MM-DD` format. An empty string means no date is selected.", - "defaultValue": "\"\"" + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -76877,7 +86091,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -76885,78 +86099,139 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DateField\n extends PreactFieldElement\n implements DateFieldProps\n{\n accessor allow: DateFieldProps['allow'];\n accessor disallow: DateFieldProps['disallow'];\n accessor allowDays: DateFieldProps['allowDays'];\n accessor disallowDays: DateFieldProps['disallowDays'];\n set view(view: string);\n get view(): string;\n accessor defaultView: DateFieldProps['defaultView'];\n constructor();\n}" + "value": "declare class DateField extends DateFieldBase implements DateFieldProps {\n constructor();\n}" }, "DateAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "DateAutocompleteField", "value": "'bday-day' | 'bday-month' | 'bday-year' | 'bday' | 'cc-expiry-month' | 'cc-expiry-year' | 'cc-expiry'", - "description": "Represents autocomplete values that are valid for date input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for date-based inputs.\n\nAvailable values:\n- `bday` - Complete birthday date\n- `bday-day` - Day component of a birthday (1-31)\n- `bday-month` - Month component of a birthday (1-12)\n- `bday-year` - Year component of a birthday (1990)\n- `cc-expiry` - Complete credit card expiration date\n- `cc-expiry-month` - Month component of a credit card expiration date (1-12)\n- `cc-expiry-year` - Year component of a credit card expiration date (2025)", - "isPublicDocs": true + "description": "" }, "DatePicker": { "filePath": "src/surfaces/admin/components.ts", "name": "DatePicker", - "description": "Configure the following properties on the date picker component.", - "isPublicDocs": true, + "description": "The date picker custom element class that renders a standalone calendar interface in the Shopify admin. This component allows merchants to select single dates or date ranges using an interactive calendar with month/year navigation, date constraints, and day-of-week restrictions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar first renders, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"single\" | \"range\"", - "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "description": "The type of date selection allowed. Available values: `single`, `range`.", "defaultValue": "\"single\"" }, { @@ -76964,7 +86239,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initially selected date(s) when the component first renders. An empty string means no date is initially selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The initial selected date or date range when the picker first renders, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -76972,14 +86247,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "value", "value": "string", - "description": "The currently selected date(s). An empty string means no date is selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The currently selected date or date range, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -76993,19 +86268,26 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@dirtyStateSymbol@11579", - "value": "boolean", + "name": "__@internals$1@16931", + "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$1@11578", - "value": "ElementInternals", + "name": "__@dirtyStateSymbol@16932", + "value": "boolean", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -77051,7 +86333,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -77059,17 +86341,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DatePicker extends BaseClass$1 implements DatePickerProps {\n accessor defaultView: string;\n set view(view: string);\n get view(): string;\n accessor allow: DatePickerProps['allow'];\n accessor disallow: DatePickerProps['disallow'];\n accessor allowDays: DatePickerProps['allowDays'];\n accessor disallowDays: DatePickerProps['disallowDays'];\n accessor type: DatePickerProps['type'];\n accessor defaultValue: DatePickerProps['defaultValue'];\n accessor name: DatePickerProps['name'];\n set value(value: string);\n get value(): string;\n /** @private */\n [dirtyStateSymbol]: boolean;\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DatePicker\n extends DatePickerBase\n implements DatePickerProps\n{\n constructor();\n}" }, "DropZone": { "filePath": "src/surfaces/admin/components.ts", "name": "DropZone", - "description": "Configure the following properties on the drop zone component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -77091,29 +86387,29 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -77129,14 +86425,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -77166,7 +86462,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@setFiles@11614", + "name": "__@setFiles@16968", "value": "(files: File[]) => void", "description": "", "isPrivate": true @@ -77174,7 +86470,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@getFileInput@11616", + "name": "__@getFileInput@16970", "value": "() => HTMLInputElement", "description": "", "isPrivate": true @@ -77182,11 +86478,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals@11615", + "name": "__@internals@16969", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -77232,7 +86535,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -77240,17 +86543,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DropZone extends BaseClass implements DropZoneProps {\n accessor accept: DropZoneProps['accept'];\n accessor accessibilityLabel: DropZoneProps['accessibilityLabel'];\n accessor disabled: DropZoneProps['disabled'];\n accessor error: DropZoneProps['error'];\n accessor label: DropZoneProps['label'];\n accessor labelAccessibilityVisibility: DropZoneProps['labelAccessibilityVisibility'];\n accessor multiple: DropZoneProps['multiple'];\n accessor name: DropZoneProps['name'];\n accessor required: DropZoneProps['required'];\n get value(): string;\n /** This sets the input value for a file type, which cannot be set programatically, so it can only be reset. */\n set value(value: '' | null);\n get files(): File[];\n set files(files: File[]);\n /** @private */\n [setFiles](files: File[]): void;\n /** @private */\n [getFileInput](): ReplaceType<\n Element | null | undefined,\n Element,\n HTMLInputElement\n >;\n\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DropZone extends DropZoneBase implements DropZoneProps {\n constructor();\n}" }, "Divider": { "filePath": "src/surfaces/admin/components.ts", "name": "Divider", - "description": "Configure the following properties on the divider component.", - "isPublicDocs": true, + "description": "A divider is a visual separator that creates a line between different sections of content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -77268,6 +86585,13 @@ "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -77313,7 +86637,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -77321,32 +86645,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Divider extends PreactCustomElement implements DividerProps {\n accessor direction: DividerProps['direction'];\n accessor color: DividerProps['color'];\n constructor();\n}" + "value": "declare class Divider extends PolarisCustomElement implements DividerProps {\n /**\n * The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n *\n * - `inline`: Horizontal divider for separating vertically stacked content\n * - `block`: Vertical divider for separating horizontally arranged content\n *\n * @default 'inline'\n */\n direction: DividerProps['direction'];\n /**\n * The visual prominence of the divider line.\n *\n * - `base`: Standard divider for most separations (default)\n * - `strong`: More prominent divider for major section breaks\n *\n * @default 'base'\n */\n color: DividerProps['color'];\n constructor();\n}" }, "EmailField": { "filePath": "src/surfaces/admin/components.ts", "name": "EmailField", - "description": "Configure the following properties on the email field component.", - "isPublicDocs": true, + "description": "The email field custom element class that renders an email input field in the Shopify admin interface. This component allows merchants to enter email addresses with automatic validation and optimized mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | EmailAutocompleteField | `section-${string} email` | `section-${string} home email` | `section-${string} mobile email` | `section-${string} fax email` | `section-${string} pager email` | \"shipping email\" | \"shipping home email\" | \"shipping mobile email\" | \"shipping fax email\" | \"shipping pager email\" | \"billing email\" | \"billing home email\" | \"billing mobile email\" | \"billing fax email\" | \"billing pager email\" | `section-${string} shipping email` | `section-${string} shipping home email` | `section-${string} shipping mobile email` | `section-${string} shipping fax email` | `section-${string} shipping pager email` | `section-${string} billing email` | `section-${string} billing home email` | `section-${string} billing mobile email` | `section-${string} billing fax email` | `section-${string} billing pager email`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint as to the intended content of the field for autocomplete purposes.", + "defaultValue": "'email'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -77354,50 +86692,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -77405,14 +86736,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -77420,7 +86751,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -77444,7 +86775,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -77468,7 +86799,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -77476,23 +86807,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -77530,7 +86875,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -77538,32 +86883,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class EmailField\n extends PreactFieldElement\n implements EmailFieldProps\n{\n accessor autocomplete: EmailFieldProps['autocomplete'];\n accessor maxLength: EmailFieldProps['maxLength'];\n accessor minLength: EmailFieldProps['minLength'];\n /**\n * The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class EmailField extends EmailFieldBase implements EmailFieldProps {\n constructor();\n}" }, "EmailAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "EmailAutocompleteField", "value": "'email' | 'home email' | 'mobile email' | 'fax email' | 'pager email'", - "description": "Represents autocomplete values that are valid for email input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for email inputs.\n\nAvailable values:\n- `email` - Primary email address\n- `home email` - Home email address\n- `mobile email` - Mobile device email address\n- `fax email` - Fax machine email address\n- `pager email` - Pager device email address", - "isPublicDocs": true + "description": "" }, "Grid": { "filePath": "src/surfaces/admin/components.ts", "name": "Grid", - "description": "Configure the following properties on the grid component.", - "isPublicDocs": true, + "description": "A grid is a layout component that arranges its children in rows and columns with precise control over sizing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridTemplateColumns", "value": "string", - "description": "The columns in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid columns.", "defaultValue": "'none'" }, { @@ -77571,7 +86929,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridTemplateRows", "value": "string", - "description": "The rows in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid rows.", "defaultValue": "'none'" }, { @@ -77579,7 +86937,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyItems", "value": "\"\" | JustifyItemsKeyword", - "description": "Aligns the grid items along the inline axis.", + "description": "The alignment of grid items along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -77587,7 +86945,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "\"\" | AlignItemsKeyword", - "description": "Aligns the grid items along the block axis.", + "description": "The alignment of grid items along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -77595,7 +86953,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeItems", "value": "AlignItemsKeyword | \"normal normal\" | \"normal stretch\" | \"normal baseline\" | \"normal first baseline\" | \"normal last baseline\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch baseline\" | \"stretch first baseline\" | \"stretch last baseline\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline baseline\" | \"baseline first baseline\" | \"baseline last baseline\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline baseline\" | \"first baseline first baseline\" | \"first baseline last baseline\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline baseline\" | \"last baseline first baseline\" | \"last baseline last baseline\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start baseline\" | \"start first baseline\" | \"start last baseline\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end baseline\" | \"end first baseline\" | \"end last baseline\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center baseline\" | \"center first baseline\" | \"center last baseline\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start baseline\" | \"unsafe start first baseline\" | \"unsafe start last baseline\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end baseline\" | \"unsafe end first baseline\" | \"unsafe end last baseline\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center baseline\" | \"unsafe center first baseline\" | \"unsafe center last baseline\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start baseline\" | \"safe start first baseline\" | \"safe start last baseline\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end baseline\" | \"safe end first baseline\" | \"safe end last baseline\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center baseline\" | \"safe center first baseline\" | \"safe center last baseline\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\"", - "description": "A shorthand property for `justify-items` and `align-items`.", + "description": "A shorthand for setting both `alignItems` and `justifyItems`.", "defaultValue": "'normal normal'" }, { @@ -77603,7 +86961,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "\"\" | JustifyContentKeyword", - "description": "Aligns the grid along the inline axis. This overrides the inline value of `placeContent`.", + "description": "The alignment of the grid along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -77611,7 +86969,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "\"\" | AlignContentKeyword", - "description": "Aligns the grid along the block axis. This overrides the block value of `placeContent`.", + "description": "The alignment of the grid along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -77619,7 +86977,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeContent", "value": "\"normal normal\" | \"normal stretch\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\" | AlignContentKeyword | \"normal space-between\" | \"normal space-around\" | \"normal space-evenly\" | \"baseline space-between\" | \"baseline space-around\" | \"baseline space-evenly\" | \"first baseline space-between\" | \"first baseline space-around\" | \"first baseline space-evenly\" | \"last baseline space-between\" | \"last baseline space-around\" | \"last baseline space-evenly\" | \"start space-between\" | \"start space-around\" | \"start space-evenly\" | \"end space-between\" | \"end space-around\" | \"end space-evenly\" | \"center space-between\" | \"center space-around\" | \"center space-evenly\" | \"unsafe start space-between\" | \"unsafe start space-around\" | \"unsafe start space-evenly\" | \"unsafe end space-between\" | \"unsafe end space-around\" | \"unsafe end space-evenly\" | \"unsafe center space-between\" | \"unsafe center space-around\" | \"unsafe center space-evenly\" | \"safe start space-between\" | \"safe start space-around\" | \"safe start space-evenly\" | \"safe end space-between\" | \"safe end space-around\" | \"safe end space-evenly\" | \"safe center space-between\" | \"safe center space-around\" | \"safe center space-evenly\" | \"stretch space-between\" | \"stretch space-around\" | \"stretch space-evenly\" | \"space-between normal\" | \"space-between start\" | \"space-between end\" | \"space-between center\" | \"space-between unsafe start\" | \"space-between unsafe end\" | \"space-between unsafe center\" | \"space-between safe start\" | \"space-between safe end\" | \"space-between safe center\" | \"space-between stretch\" | \"space-between space-between\" | \"space-between space-around\" | \"space-between space-evenly\" | \"space-around normal\" | \"space-around start\" | \"space-around end\" | \"space-around center\" | \"space-around unsafe start\" | \"space-around unsafe end\" | \"space-around unsafe center\" | \"space-around safe start\" | \"space-around safe end\" | \"space-around safe center\" | \"space-around stretch\" | \"space-around space-between\" | \"space-around space-around\" | \"space-around space-evenly\" | \"space-evenly normal\" | \"space-evenly start\" | \"space-evenly end\" | \"space-evenly center\" | \"space-evenly unsafe start\" | \"space-evenly unsafe end\" | \"space-evenly unsafe center\" | \"space-evenly safe start\" | \"space-evenly safe end\" | \"space-evenly safe center\" | \"space-evenly stretch\" | \"space-evenly space-between\" | \"space-evenly space-around\" | \"space-evenly space-evenly\"", - "description": "A shorthand property for `justify-content` and `align-content`.", + "description": "A shorthand for setting both `alignContent` and `justifyContent`.", "defaultValue": "'normal normal'" }, { @@ -77627,7 +86985,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows and columns.", "defaultValue": "'none'" }, { @@ -77635,7 +86993,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "s spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows.", "defaultValue": "'' - meaning no override" }, { @@ -77643,7 +87001,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid columns.", "defaultValue": "'' - meaning no override" }, { @@ -77651,7 +87009,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -77659,7 +87017,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -77667,7 +87025,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -77675,7 +87033,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -77683,7 +87041,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -77691,7 +87049,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -77699,7 +87057,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -77707,7 +87065,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -77715,7 +87073,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -77723,7 +87081,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -77731,7 +87089,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -77739,7 +87097,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -77747,7 +87105,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -77755,7 +87113,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -77763,7 +87121,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -77771,7 +87129,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -77779,7 +87137,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -77799,7 +87157,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -77807,7 +87165,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -77815,7 +87173,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -77823,7 +87181,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -77831,14 +87189,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -77846,9 +87204,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -77894,7 +87259,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -77902,96 +87267,101 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n accessor gridTemplateColumns: GridProps['gridTemplateColumns'];\n accessor gridTemplateRows: GridProps['gridTemplateRows'];\n accessor justifyItems: GridProps['justifyItems'];\n accessor alignItems: GridProps['alignItems'];\n accessor placeItems: GridProps['placeItems'];\n accessor justifyContent: GridProps['justifyContent'];\n accessor alignContent: GridProps['alignContent'];\n accessor placeContent: GridProps['placeContent'];\n accessor gap: GridProps['gap'];\n accessor rowGap: GridProps['rowGap'];\n accessor columnGap: GridProps['columnGap'];\n}" + "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n /**\n * The template that defines the grid columns.\n */\n gridTemplateColumns: GridProps['gridTemplateColumns'];\n /**\n * The template that defines the grid rows.\n */\n gridTemplateRows: GridProps['gridTemplateRows'];\n /**\n * The alignment of grid items along the inline axis.\n */\n justifyItems: GridProps['justifyItems'];\n /**\n * The alignment of grid items along the block axis.\n */\n alignItems: GridProps['alignItems'];\n /**\n * A shorthand for setting both `alignItems` and `justifyItems`.\n */\n placeItems: GridProps['placeItems'];\n /**\n * The alignment of the grid along the inline axis.\n */\n justifyContent: GridProps['justifyContent'];\n /**\n * The alignment of the grid along the block axis.\n */\n alignContent: GridProps['alignContent'];\n /**\n * A shorthand for setting both `alignContent` and `justifyContent`.\n */\n placeContent: GridProps['placeContent'];\n /**\n * The spacing between grid rows and columns.\n */\n gap: GridProps['gap'];\n /**\n * The spacing between grid rows.\n */\n rowGap: GridProps['rowGap'];\n /**\n * The spacing between grid columns.\n */\n columnGap: GridProps['columnGap'];\n}" }, "JustifyItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.\n\nLearn more about the [justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).", - "isPublicDocs": true + "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis." }, "BaselinePosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BaselinePosition", "value": "'baseline' | 'first baseline' | 'last baseline'", - "description": "Represents baseline alignment positions used to align items relative to their baselines.\n- `baseline`: Aligns to the baseline of the parent.\n- `first baseline`: Aligns to the first baseline of the parent.\n- `last baseline`: Aligns to the last baseline of the parent.", - "isPublicDocs": true + "description": "" }, "OverflowPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "OverflowPosition", "value": "`unsafe ${ContentPosition}` | `safe ${ContentPosition}`", - "description": "Represents content positioning with overflow behavior control. Use `safe` to prevent content from becoming inaccessible when it overflows, or `unsafe` to allow overflow regardless of accessibility.", - "isPublicDocs": true + "description": "" }, "ContentPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentPosition", "value": "'center' | 'start' | 'end'", - "description": "Defines the position of content along an axis.\n- `center`: Centers the content.\n- `start`: Aligns content to the start.\n- `end`: Aligns content to the end.", - "isPublicDocs": true + "description": "" }, "AlignItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Align items sets the align-self value on all direct children as a group.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isPublicDocs": true + "description": "Align items sets the align-self value on all direct children as a group." }, "JustifyContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyContentKeyword", "value": "'normal' | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", - "isPublicDocs": true + "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container." }, "ContentDistribution": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentDistribution", "value": "'space-between' | 'space-around' | 'space-evenly' | 'stretch'", - "description": "Defines how space is distributed between and around content items in flex and grid layouts.\n- `space-between`: Distributes items evenly with the first item at the start and last at the end.\n- `space-around`: Distributes items evenly with equal space around each item.\n- `space-evenly`: Distributes items evenly with equal space between them.\n- `stretch`: Stretches items to fill the container.", - "isPublicDocs": true + "description": "" }, "AlignContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignContentKeyword", "value": "'normal' | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isPublicDocs": true + "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis." }, "SpacingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SpacingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the spacing size between elements, using the standard size scale or `none` for no spacing.", - "isPublicDocs": true + "description": "" }, "GridItem": { "filePath": "src/surfaces/admin/components.ts", "name": "GridItem", - "description": "The grid item component represents a single cell within a grid layout, allowing you to control how content is positioned and sized within the grid. Use grid item as a child of grid to specify column span, row span, and positioning for individual content areas.\n\nGrid item supports precise placement control through column and row properties, enabling you to create complex layouts where different items occupy varying amounts of space or appear in specific grid positions.", - "isPublicDocs": true, + "description": "A grid item is a child of a grid that can be positioned within specific rows and columns.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridColumn", "value": "\"auto\" | `span ${number}`", - "description": "The number of columns the item will span across.\n\nLearn more about the [grid-column property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).", + "description": "The column position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -77999,7 +87369,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridRow", "value": "\"auto\" | `span ${number}`", - "description": "The number of rows the item will span across.\n\nLearn more about the [grid-row property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).", + "description": "The row position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -78007,7 +87377,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -78015,7 +87385,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -78023,7 +87393,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -78031,7 +87401,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -78039,7 +87409,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -78047,7 +87417,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -78055,7 +87425,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -78063,7 +87433,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -78071,7 +87441,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -78079,7 +87449,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -78087,7 +87457,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -78095,7 +87465,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -78103,7 +87473,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -78111,7 +87481,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -78119,7 +87489,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -78127,7 +87497,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -78135,7 +87505,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -78155,7 +87525,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -78163,7 +87533,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -78171,7 +87541,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -78179,7 +87549,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -78187,14 +87557,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -78202,9 +87572,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -78250,7 +87627,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -78258,24 +87635,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class GridItem extends BoxElement implements GridItemProps {\n accessor gridColumn: GridItemProps['gridColumn'];\n accessor gridRow: GridItemProps['gridRow'];\n constructor();\n}" + "value": "declare class GridItem extends BoxElement implements GridItemProps {\n /**\n * The column position and span of the grid item.\n */\n gridColumn: GridItemProps['gridColumn'];\n /**\n * The row position and span of the grid item.\n */\n gridRow: GridItemProps['gridRow'];\n constructor();\n}" }, "Heading": { "filePath": "src/surfaces/admin/components.ts", "name": "Heading", - "description": "Configure the following properties on the heading component.", - "isPublicDocs": true, + "description": "A custom element for displaying hierarchical section titles and headings with appropriate semantic meaning and visual styling. Use Heading to structure your content with proper heading levels for both visual hierarchy and accessibility.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"heading\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The ARIA role for the heading. Set to `'heading'` (the default) for standard heading semantics, or `'presentation'` / `'none'` to remove heading semantics for decorative use.", "defaultValue": "'heading'" }, { @@ -78283,7 +87674,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lineClamp", "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", "defaultValue": "Infinity - no truncation is applied" }, { @@ -78291,9 +87682,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -78339,7 +87737,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -78347,47 +87745,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Heading extends PreactCustomElement implements HeadingProps {\n accessor accessibilityRole: HeadingProps['accessibilityRole'];\n accessor lineClamp: HeadingProps['lineClamp'];\n accessor accessibilityVisibility: HeadingProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Heading extends HeadingBase implements HeadingProps {\n constructor();\n}" }, "Icon": { "filePath": "src/surfaces/admin/components.ts", "name": "Icon", - "description": "Configure the following properties on the icon component.", - "isPublicDocs": true, + "description": "An icon displays a graphical symbol from the icon library.", "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", + "description": "The color tone of the icon based on its semantic meaning.", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "The icon to display from the icon library.\n\nSet to a valid icon name to display that icon. To hide the icon completely, use an empty string `''`. To reserve the icon's space without displaying an icon, use `'empty'`." + "value": "\"\" | IconType", + "description": "The type of icon to display." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color emphasis of the icon.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"base\"", - "description": "The size of the icon.\n\n- `small`: Smaller icon suitable for inline use within text or compact UI elements.\n- `base`: Default size that works well for standalone icons and standard use cases.", + "description": "The size of the icon.", "defaultValue": "'base'" }, { @@ -78395,7 +87807,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The element that this icon should show interest for when activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -78442,7 +87861,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -78450,53 +87869,67 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Icon extends PreactCustomElement implements IconProps {\n accessor color: IconProps['color'];\n accessor tone: IconProps['tone'];\n accessor type: IconProps['type'];\n accessor size: IconProps['size'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Icon extends IconBase implements IconProps {\n /**\n * The color tone of the icon based on its semantic meaning.\n */\n tone: IconProps['tone'];\n /**\n * The type of icon to display.\n */\n type: IconProps['type'];\n constructor();\n}" }, "Image": { "filePath": "src/surfaces/admin/components.ts", "name": "Image", - "description": "Configure the following properties on the image component.", - "isPublicDocs": true, + "description": "An image displays pictures with configurable sizing, loading behavior, and borders.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "srcSet", "value": "string", - "description": "A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n\nLearn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset)." + "description": "A set of source images with different sizes for responsive loading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "sizes", "value": "string", - "description": "A set of media conditions and their corresponding sizes.\n\nLearn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes)." + "description": "The sizes of the image at different viewport widths." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "aspectRatio", "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", - "description": "The aspect ratio of the image.\n\nThe rendering of the image will depend on the `inlineSize` value:\n\n- `inlineSize=\"fill\"`: the aspect ratio will be respected and the image will take the necessary space.\n- `inlineSize=\"auto\"`: the image will not render until it has loaded and the aspect ratio will be ignored.\n\nFor example, if the value is set as `50 / 100`, the getter returns `50 / 100`. If the value is set as `0.5`, the getter returns `0.5 / 1`.\n\nLearn more about the [aspect-ratio property](https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio).", + "description": "The aspect ratio of the image as a width-to-height ratio.", "defaultValue": "'1/1'" }, { @@ -78504,7 +87937,7 @@ "syntaxKind": "PropertyDeclaration", "name": "objectFit", "value": "\"contain\" | \"cover\"", - "description": "The image resizing behavior to fit within its container.\n\n- `contain`: Scales the image to fit within the container while maintaining its aspect ratio. The entire image is visible, but might leave empty space.\n- `cover`: Scales the image to fill the entire container while maintaining its aspect ratio. The image might be cropped to fit.\n\nThe image is always positioned in the center of the container.\n\nLearn more about the [object-fit property](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).", + "description": "How the image should be resized to fit its container.", "defaultValue": "'contain'" }, { @@ -78512,7 +87945,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "\"eager\" | \"lazy\"", - "description": "The loading strategy for the image.\n\n- `eager`: Immediately loads the image, irrespective of its position within the visible viewport.\n- `lazy`: Delays loading the image until it approaches a specified distance from the viewport.\n\nLearn more about the [loading attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading).", + "description": "When the image should be loaded.", "defaultValue": "'eager'" }, { @@ -78520,7 +87953,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"img\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The accessibility role for the image.", "defaultValue": "'img'" }, { @@ -78528,7 +87961,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "\"auto\" | \"fill\"", - "description": "The displayed inline width of the image.\n\n- `fill`: the image will takes up 100% of the available inline size.\n- `auto`: the image will be displayed at its natural size.\n\nLearn more about the [width attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#width).", + "description": "The inline size (width in horizontal writing modes) of the image.", "defaultValue": "'fill'" }, { @@ -78536,35 +87969,23 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied around the image using shorthand syntax to specify width, color, and style in a single property.", - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "description": "Whether to show a border around the image.", + "defaultValue": "'none' - equivalent to `none base auto`." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderWidth", - "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderStyle", - "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image.", "defaultValue": "'' - meaning no override" }, { @@ -78572,17 +87993,24 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "The color of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the image's corners using the design system's radius scale.", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image.", "defaultValue": "'none'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -78628,7 +88056,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -78636,24 +88064,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Image extends PreactCustomElement implements ImageProps {\n accessor src: ImageProps['src'];\n accessor srcSet: ImageProps['srcSet'];\n accessor sizes: ImageProps['sizes'];\n accessor alt: ImageProps['alt'];\n accessor aspectRatio: ImageProps['aspectRatio'];\n accessor objectFit: ImageProps['objectFit'];\n accessor loading: ImageProps['loading'];\n accessor accessibilityRole: ImageProps['accessibilityRole'];\n accessor inlineSize: ImageProps['inlineSize'];\n /**\n * A border applied around the image using shorthand syntax to specify width, color, and style in a single property.\n */\n accessor border: ImageProps['border'];\n /**\n * The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.\n */\n accessor borderWidth: ImageProps['borderWidth'];\n /**\n * The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.\n */\n accessor borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.\n */\n accessor borderColor: ImageProps['borderColor'];\n /**\n * The roundedness of the image's corners using the design system's radius scale.\n */\n accessor borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + "value": "declare class Image extends PolarisCustomElement implements ImageProps {\n /**\n * The URL of the image to display.\n */\n src: ImageProps['src'];\n /**\n * A set of source images with different sizes for responsive loading.\n */\n srcSet: ImageProps['srcSet'];\n /**\n * The sizes of the image at different viewport widths.\n */\n sizes: ImageProps['sizes'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ImageProps['alt'];\n /**\n * The aspect ratio of the image as a width-to-height ratio.\n */\n aspectRatio: ImageProps['aspectRatio'];\n /**\n * How the image should be resized to fit its container.\n */\n objectFit: ImageProps['objectFit'];\n /**\n * When the image should be loaded.\n */\n loading: ImageProps['loading'];\n /**\n * The accessibility role for the image.\n */\n accessibilityRole: ImageProps['accessibilityRole'];\n /**\n * The inline size (width in horizontal writing modes) of the image.\n */\n inlineSize: ImageProps['inlineSize'];\n /**\n * Whether to show a border around the image.\n */\n border: ImageProps['border'];\n /**\n * The width of the border around the image.\n */\n borderWidth: ImageProps['borderWidth'];\n /**\n * The style of the border around the image.\n */\n borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image.\n */\n borderColor: ImageProps['borderColor'];\n /**\n * The radius of the border corners around the image.\n */\n borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + }, + "BorderRadiusKeyword": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "BorderRadiusKeyword", + "value": "SizeKeyword | 'max' | 'none'", + "description": "" }, "Link": { "filePath": "src/surfaces/admin/components.ts", "name": "Link", - "description": "Configure the following properties on the link component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", "defaultValue": "'auto'" }, { @@ -78661,21 +88110,21 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -78683,14 +88132,21 @@ "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "lang", "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)." + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -78737,7 +88193,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -78745,15 +88201,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -78761,24 +88232,30 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Link extends Link_base implements LinkProps {\n accessor tone: LinkProps['tone'];\n accessor accessibilityLabel: LinkProps['accessibilityLabel'];\n accessor href: LinkProps['href'];\n accessor target: LinkProps['target'];\n accessor download: LinkProps['download'];\n accessor lang: LinkProps['lang'];\n constructor();\n}" + "value": "declare class Link extends LinkBase implements LinkProps {\n tone: LinkProps['tone'];\n constructor();\n}" }, "ListItem": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItem", - "description": "The list item component represents a single entry within an ordered list or unordered list. Use list item to structure individual points, steps, or items within a list, with each item automatically receiving appropriate list markers (bullets or numbers) from its parent list.\n\nList item must be used as a direct child of ordered list or unordered list components. Each list item can contain text, inline formatting, or other components to create rich list content.", - "isPublicDocs": true, + "description": "A component that represents a single item within an ordered list or unordered list.\n\nUse list item as a child of ordered list or unordered list to create properly structured and accessible list content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -78824,7 +88301,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -78832,24 +88309,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ListItem extends PreactCustomElement implements ListItemProps {\n constructor();\n}" + "value": "declare class ListItem extends PolarisCustomElement implements ListItemProps {\n constructor();\n}" }, "Menu": { "filePath": "src/surfaces/admin/components.ts", "name": "Menu", - "description": "Configure the following properties on the menu component.", - "isPublicDocs": true, + "description": "A component that displays a contextual list of actions or options, which is typically triggered by a button or other activator element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the menu for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", @@ -78870,7 +88361,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -78878,7 +88369,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -78886,11 +88377,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -78920,7 +88418,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -78928,24 +88426,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n accessor accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n /**\n * A label that describes the menu for assistive technologies.\n */\n accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "MoneyField": { "filePath": "src/surfaces/admin/components.ts", "name": "MoneyField", - "description": "Configure the following properties on the money field component.", - "isPublicDocs": true, + "description": "The money field custom element class that renders a monetary input field in the Shopify admin interface. This component allows merchants to enter currency amounts with automatic formatting, decimal precision, and validation against minimum and maximum values.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum monetary value allowed in the field.", "defaultValue": "Infinity" }, { @@ -78953,9 +88465,17 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum monetary value allowed in the field.", "defaultValue": "-Infinity" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "currencyCode", + "value": "\"auto\" | CurrencyCode", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -78968,7 +88488,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "string", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -78976,35 +88496,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -79012,14 +88532,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -79027,7 +88547,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -79051,7 +88571,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -79075,7 +88595,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -79083,23 +88603,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -79137,7 +88664,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -79145,17 +88672,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class MoneyField\n extends PreactFieldElement\n implements MoneyFieldProps\n{\n accessor max: MoneyFieldProps['max'];\n accessor min: MoneyFieldProps['min'];\n /**\n * The current monetary value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string representing the amount in the store's currency.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class MoneyField extends MoneyFieldBase implements MoneyFieldProps {\n constructor();\n}" + }, + "CurrencyCode": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CurrencyCode", + "value": "'USD' | 'EUR' | 'GBP' | 'CAD' | 'AFN' | 'ALL' | 'DZD' | 'AOA' | 'ARS' | 'AMD' | 'AWG' | 'AUD' | 'BBD' | 'AZN' | 'BDT' | 'BSD' | 'BHD' | 'BIF' | 'BZD' | 'BMD' | 'BTN' | 'BAM' | 'BRL' | 'BOB' | 'BWP' | 'BND' | 'BGN' | 'MMK' | 'KHR' | 'CVE' | 'KYD' | 'XAF' | 'CLP' | 'CNY' | 'COP' | 'KMF' | 'CDF' | 'CRC' | 'HRK' | 'CZK' | 'DKK' | 'DOP' | 'XCD' | 'EGP' | 'ETB' | 'XPF' | 'FJD' | 'GMD' | 'GHS' | 'GTQ' | 'GYD' | 'GEL' | 'HTG' | 'HNL' | 'HKD' | 'HUF' | 'ISK' | 'INR' | 'IDR' | 'ILS' | 'IQD' | 'JMD' | 'JPY' | 'JEP' | 'JOD' | 'KZT' | 'KES' | 'KWD' | 'KGS' | 'LAK' | 'LVL' | 'LBP' | 'LSL' | 'LRD' | 'LTL' | 'MGA' | 'MKD' | 'MOP' | 'MWK' | 'MVR' | 'MXN' | 'MYR' | 'MUR' | 'MDL' | 'MAD' | 'MNT' | 'MZN' | 'NAD' | 'NPR' | 'ANG' | 'NZD' | 'NIO' | 'NGN' | 'NOK' | 'OMR' | 'PAB' | 'PKR' | 'PGK' | 'PYG' | 'PEN' | 'PHP' | 'PLN' | 'QAR' | 'RON' | 'RUB' | 'RWF' | 'WST' | 'SAR' | 'RSD' | 'SCR' | 'SGD' | 'SDG' | 'SYP' | 'ZAR' | 'KRW' | 'SSP' | 'SBD' | 'LKR' | 'SRD' | 'SZL' | 'SEK' | 'CHF' | 'TWD' | 'THB' | 'TZS' | 'TTD' | 'TND' | 'TRY' | 'TMT' | 'UGX' | 'UAH' | 'AED' | 'UYU' | 'UZS' | 'VUV' | 'VND' | 'XOF' | 'YER' | 'ZMW' | 'BYN' | 'BYR' | 'DJF' | 'ERN' | 'FKP' | 'GIP' | 'GNF' | 'IRR' | 'KID' | 'LYD' | 'MRU' | 'SLL' | 'SHP' | 'SOS' | 'STD' | 'STN' | 'TJS' | 'TOP' | 'VED' | 'VEF' | 'VES' | 'XXX'", + "description": "" }, "NumberField": { "filePath": "src/surfaces/admin/components.ts", "name": "NumberField", - "description": "Configure the following properties on the number field component.", - "isPublicDocs": true, + "description": "The number field custom element class that renders a numeric input field in the Shopify admin interface. This component allows merchants to enter numbers with automatic validation and prefix/suffix display.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -79169,7 +88717,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inputMode", "value": "\"decimal\" | \"numeric\"", - "description": "The type of virtual keyboard to display on mobile devices.\n\n- `decimal`: Shows a numeric keyboard with a decimal point, suitable for prices or measurements.\n- `numeric`: Shows a numeric keyboard without a decimal point, suitable for whole numbers like quantities.\n\nLearn more about the [inputmode attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode).", + "description": "The input mode hint for mobile keyboards. Available values include:\n- `numeric`: Shows a numeric keypad optimized for entering numbers\n- `decimal`: Shows a numeric keypad with decimal point support\n- `tel`: Shows a telephone keypad", "defaultValue": "'decimal'" }, { @@ -79177,7 +88725,7 @@ "syntaxKind": "PropertyDeclaration", "name": "step", "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "description": "The granularity that the value must adhere to, or the keyword `any`. This controls the increment/decrement step size.", "defaultValue": "1" }, { @@ -79185,7 +88733,7 @@ "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum numeric value allowed in the field.", "defaultValue": "Infinity" }, { @@ -79193,7 +88741,7 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum numeric value allowed in the field.", "defaultValue": "-Infinity" }, { @@ -79201,7 +88749,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the user's input, such as a currency symbol.", "defaultValue": "''" }, { @@ -79209,7 +88757,7 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the user's input, such as a unit of measurement.", "defaultValue": "''" }, { @@ -79217,7 +88765,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | NumberAutocompleteField | `section-${string} one-time-code` | `section-${string} cc-number` | `section-${string} cc-csc` | \"shipping one-time-code\" | \"shipping cc-number\" | \"shipping cc-csc\" | \"billing one-time-code\" | \"billing cc-number\" | \"billing cc-csc\" | `section-${string} shipping one-time-code` | `section-${string} shipping cc-number` | `section-${string} shipping cc-csc` | `section-${string} billing one-time-code` | `section-${string} billing cc-number` | `section-${string} billing cc-csc`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -79225,35 +88773,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -79261,14 +88809,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -79276,7 +88824,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -79300,7 +88848,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -79324,7 +88872,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -79332,23 +88880,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -79386,7 +88941,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -79394,32 +88949,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class NumberField\n extends PreactFieldElement\n implements NumberFieldProps\n{\n /**\n * The current numeric value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string (decimal or integer).\n */\n get value(): string;\n set value(value: string);\n accessor inputMode: NumberFieldProps['inputMode'];\n accessor step: NumberFieldProps['step'];\n accessor max: NumberFieldProps['max'];\n accessor min: NumberFieldProps['min'];\n accessor prefix: NumberFieldProps['prefix'];\n accessor suffix: NumberFieldProps['suffix'];\n constructor();\n}" + "value": "declare class NumberField extends NumberFieldBase implements NumberFieldProps {\n constructor();\n}" }, "NumberAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "NumberAutocompleteField", "value": "'one-time-code' | 'cc-number' | 'cc-csc'", - "description": "Represents autocomplete values that are valid for number input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for numeric inputs.\n\nAvailable values:\n- `one-time-code` - One-time codes for authentication (OTP, 2FA codes)\n- `cc-number` - Credit card number\n- `cc-csc` - Credit card security code (CVV/CVC)", - "isPublicDocs": true + "description": "" }, "Option": { "filePath": "src/surfaces/admin/components.ts", "name": "Option", - "description": "Represents a single option within a select component. Use only as a child of s-select components.", - "isPublicDocs": true, + "description": "A single option within a select dropdown that users can choose.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the option is currently selected.", "defaultValue": "false" }, { @@ -79427,7 +88995,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the option should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -79435,16 +89003,23 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this option is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the option is disabled and can't be selected.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -79490,7 +89065,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -79498,24 +89073,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Option extends PreactCustomElement implements OptionProps {\n accessor selected: OptionProps['selected'];\n accessor defaultSelected: OptionProps['defaultSelected'];\n accessor value: OptionProps['value'];\n accessor disabled: OptionProps['disabled'];\n constructor();\n}" + "value": "declare class Option extends PolarisCustomElement implements OptionProps {\n /**\n * Whether the option is currently selected.\n */\n selected: OptionProps['selected'];\n /**\n * Whether the option should be selected when it's first rendered.\n */\n defaultSelected: OptionProps['defaultSelected'];\n /**\n * The value that's submitted with the form when this option is selected.\n */\n value: OptionProps['value'];\n /**\n * Whether the option is disabled and can't be selected.\n */\n disabled: OptionProps['disabled'];\n constructor();\n}" }, "OptionGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionGroup", - "description": "Represents a group of options within a select component. Use only as a child of `s-select` components.", - "isPublicDocs": true, + "description": "A group of related options within a select dropdown, displayed with a label.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the options within this group can be selected or not.", + "description": "Whether all options in the group are disabled and can't be selected.", "defaultValue": "false" }, { @@ -79523,7 +89112,14 @@ "syntaxKind": "PropertyDeclaration", "name": "label", "value": "string", - "description": "The user-facing label for this group of options." + "description": "The text that describes what this group of options represents." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -79570,7 +89166,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -79578,18 +89174,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OptionGroup\n extends PreactCustomElement\n implements OptionGroupProps\n{\n accessor disabled: OptionGroupProps['disabled'];\n accessor label: OptionGroupProps['label'];\n constructor();\n}" + "value": "declare class OptionGroup\n extends PolarisCustomElement\n implements OptionGroupProps\n{\n /**\n * Whether all options in the group are disabled and can't be selected.\n */\n disabled: OptionGroupProps['disabled'];\n /**\n * The text that describes what this group of options represents.\n */\n label: OptionGroupProps['label'];\n constructor();\n}" }, "OrderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "OrderedList", - "description": "Configure the following properties on the ordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a numbered list of items with automatic numbering and proper list semantics. Use ordered list when the sequence or order of items matters, such as instructions, rankings, or step-by-step processes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -79635,7 +89252,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -79643,48 +89260,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OrderedList\n extends PreactCustomElement\n implements OrderedListProps\n{\n constructor();\n}" + "value": "declare class OrderedList\n extends PolarisCustomElement\n implements OrderedListProps\n{\n constructor();\n}" }, "Paragraph": { "filePath": "src/surfaces/admin/components.ts", "name": "Paragraph", - "description": "Configure the following properties on the paragraph component.", - "isPublicDocs": true, + "description": "A custom element for displaying blocks of text content with consistent spacing and styling for readable body copy. Use Paragraph to render longer text content with proper line height and spacing between paragraphs.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "lineClamp", - "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", - "defaultValue": "Infinity - no truncation is applied" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the paragraph text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"caution\"", - "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "lineClamp", + "value": "number", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", + "defaultValue": "Infinity - no truncation is applied" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color of the paragraph text.", "defaultValue": "'base'" }, { @@ -79692,7 +89323,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -79700,9 +89331,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -79748,7 +89386,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -79756,24 +89394,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Paragraph extends PreactCustomElement implements ParagraphProps {\n accessor fontVariantNumeric: ParagraphProps['fontVariantNumeric'];\n accessor lineClamp: ParagraphProps['lineClamp'];\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: ParagraphProps['tone'];\n\n accessor color: ParagraphProps['color'];\n accessor dir: ParagraphProps['dir'];\n accessor accessibilityVisibility: ParagraphProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Paragraph extends ParagraphBase implements ParagraphProps {\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: ParagraphProps['tone'];\n constructor();\n}" }, "PasswordField": { "filePath": "src/surfaces/admin/components.ts", "name": "PasswordField", - "description": "Configure the following properties on the password field component.", - "isPublicDocs": true, + "description": "The password field custom element class that renders a password input field in the Shopify admin interface. This component allows merchants to enter passwords securely with characters automatically masked for privacy.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the password.", "defaultValue": "Infinity" }, { @@ -79781,22 +89433,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the password.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | PasswordAutocompleteField | `section-${string} current-password` | `section-${string} new-password` | \"shipping current-password\" | \"shipping new-password\" | \"billing current-password\" | \"billing new-password\" | `section-${string} shipping current-password` | `section-${string} shipping new-password` | `section-${string} billing current-password` | `section-${string} billing new-password`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -79804,35 +89449,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -79840,14 +89485,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -79855,7 +89500,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -79879,7 +89524,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -79903,7 +89548,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -79911,23 +89556,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -79965,7 +89624,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -79973,34 +89632,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class PasswordField\n extends PreactFieldElement\n implements PasswordFieldProps\n{\n accessor maxLength: PasswordFieldProps['maxLength'];\n accessor minLength: PasswordFieldProps['minLength'];\n /**\n * The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class PasswordField\n extends PasswordFieldBase\n implements PasswordFieldProps\n{\n constructor();\n}" }, "PasswordAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PasswordAutocompleteField", "value": "'current-password' | 'new-password'", - "description": "Represents autocomplete values that are valid for password input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for password inputs.\n\nAvailable values:\n- `current-password` - Existing password for login or authentication\n- `new-password` - New password when creating an account or changing password", - "isPublicDocs": true + "description": "" }, "QueryContainer": { "filePath": "src/surfaces/admin/components.ts", "name": "QueryContainer", - "description": "Configure the following properties on the query container component.", - "isPublicDocs": true, + "description": "A component that sets up a container query context, which lets child elements style themselves based on the container's size instead of the viewport size.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "containerName", "value": "string", - "description": "An identifier for this container that you can reference in CSS container queries to apply styles based on this specific container's size.\n\nAll query container components automatically receive a container name of `s-default`. You can omit the container name in your queries, so `@container (inline-size <= 300px)` is equivalent to `@container s-default (inline-size <= 300px)`.\n\nWhen you provide a custom `containerName`, it's added alongside `s-default`. For example, `containerName=\"product-card\"` results in `s-default product-card` being set on the `container-name` CSS property, allowing you to target this container with `@container product-card (inline-size <= 300px)`.\n\nLearn more about the [container-name property](https://developer.mozilla.org/en-US/docs/Web/CSS/container-name).", + "description": "The name of the container, which you can reference in CSS container queries.", "defaultValue": "''" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -80046,7 +89725,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -80054,24 +89733,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class QueryContainer\n extends PreactCustomElement\n implements QueryContainerProps\n{\n accessor containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" + "value": "declare class QueryContainer\n extends PolarisCustomElement\n implements QueryContainerProps\n{\n /**\n * The name of the container, which you can reference in CSS container queries.\n */\n containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" }, "SearchField": { "filePath": "src/surfaces/admin/components.ts", "name": "SearchField", - "description": "Configure the following properties on the search field component.", - "isPublicDocs": true, + "description": "A search field that lets users enter search queries with a search-specific input type.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters that can be entered in the field.", "defaultValue": "Infinity" }, { @@ -80079,22 +89772,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters that must be entered for the field to be valid.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -80102,35 +89788,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -80138,14 +89824,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -80153,7 +89839,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -80177,7 +89863,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -80201,7 +89887,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -80209,23 +89895,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -80263,7 +89963,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -80271,25 +89971,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class SearchField\n extends PreactFieldElement\n implements SearchFieldProps\n{\n accessor maxLength: SearchFieldProps['maxLength'];\n accessor minLength: SearchFieldProps['minLength'];\n /**\n * The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class SearchField extends SearchFieldBase implements SearchFieldProps {\n constructor();\n}" }, "TextAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" }, "Section": { "filePath": "src/surfaces/admin/components.ts", "name": "Section", - "description": "Configure the following properties on the section component.", - "isPublicDocs": true, + "description": "A section is a container that groups related content together with an optional heading.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -80299,28 +90012,43 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "The accessibility label for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The heading text displayed at the top of the section. This heading provides a title for the section's content and automatically uses the appropriate semantic heading level (h2, h3, h4) based on nesting depth to maintain proper document structure." + "description": "The heading text for the section." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "\"base\" | \"none\"", - "description": "The padding applied to all edges of the element.\n\n- `base`: applies padding that is appropriate for the element. Note that it might result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the section need to span to the edge of the section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "description": "Whether the section has padding.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -80337,14 +90065,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -80358,7 +90078,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -80366,59 +90086,73 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Section extends PreactCustomElement implements SectionProps {\n constructor();\n /** @private */\n connectedCallback(): void;\n accessor accessibilityLabel: SectionProps['accessibilityLabel'];\n accessor heading: SectionProps['heading'];\n accessor padding: SectionProps['padding'];\n}" + "value": "declare class Section extends SectionBase implements SectionProps {\n constructor();\n}" }, "Select": { "filePath": "src/surfaces/admin/components.ts", "name": "Select", - "description": "Configure the following properties on the select component.", - "isPublicDocs": true, + "description": "A select dropdown that lets users choose one option from a list.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier." + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the select." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the select when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the select is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "Text that appears in the select when no option is selected to provide a hint about what to choose." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether an option must be selected before the form can be submitted.", "defaultValue": "false" }, { @@ -80426,7 +90160,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -80450,7 +90184,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component." + "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected Option component." }, { "filePath": "src/surfaces/admin/components.ts", @@ -80463,15 +90197,15 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@usedFirstOptionSymbol@12029", + "name": "__@usedFirstOptionSymbol@17470", "value": "boolean", - "description": "A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n\nThis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.", + "description": "used to determine if no value or defaultValue was set, in which case the first non-disabled option was used\n\nthis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@hasInitialValueSymbol@12030", + "name": "__@hasInitialValueSymbol@17471", "value": "boolean", "description": "", "isPrivate": true @@ -80481,7 +90215,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -80489,23 +90223,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -80535,7 +90276,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -80543,33 +90284,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Select extends PreactInputElement implements SelectProps {\n accessor icon: SelectProps['icon'];\n accessor details: SelectProps['details'];\n accessor error: SelectProps['error'];\n accessor label: SelectProps['label'];\n accessor placeholder: SelectProps['placeholder'];\n accessor required: SelectProps['required'];\n accessor labelAccessibilityVisibility: SelectProps['labelAccessibilityVisibility'];\n /** @private */\n connectedCallback(): void;\n /**\n * A lifecycle callback that fires when the component is removed from the DOM. Performs cleanup operations.\n * @private\n */\n disconnectedCallback(): void;\n constructor();\n /**\n * A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n *\n * This is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.\n * @private\n */\n [usedFirstOptionSymbol]: boolean;\n /**\n * @private\n */\n [hasInitialValueSymbol]: boolean;\n /**\n * The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component.\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n}" + "value": "declare class Select extends SelectBase implements SelectProps {\n constructor();\n}" }, "Spinner": { "filePath": "src/surfaces/admin/components.ts", "name": "Spinner", - "description": "Configure the following properties on the spinner component.", - "isPublicDocs": true, + "description": "A component that displays an animated loading indicator to show that content is currently being processed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the spinner for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the loading spinner.\n\n- `base`: Default size suitable for inline loading indicators or standard UI contexts.\n- `large`: Larger spinner for more prominent loading states.\n- `large-100`: Extra large spinner for full-page or emphasized loading states.", + "description": "The size of the spinner.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -80615,7 +90377,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -80623,24 +90385,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Spinner extends PreactCustomElement implements SpinnerProps {\n accessor accessibilityLabel: string;\n accessor size: SpinnerProps['size'];\n constructor();\n}" + "value": "declare class Spinner extends PolarisCustomElement implements SpinnerProps {\n /**\n * A label that describes the spinner for assistive technologies.\n */\n accessibilityLabel: string;\n /**\n * The size of the spinner.\n */\n size: SpinnerProps['size'];\n constructor();\n}" }, "Stack": { "filePath": "src/surfaces/admin/components.ts", "name": "Stack", - "description": "Configure the following properties on the stack component.", - "isPublicDocs": true, + "description": "A stack is a layout component that arranges its children in a single direction with controlled spacing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "direction", "value": "MaybeResponsive<\"inline\" | \"block\">", - "description": "The direction in which the stack's children are placed within the stack.\n\nAccepts:\n- A single value, either `inline` or `block`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported direction values as a query value", + "description": "The direction in which the stack's children are arranged.", "defaultValue": "'block'" }, { @@ -80648,7 +90424,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "JustifyContentKeyword", - "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -80656,7 +90432,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "AlignItemsKeyword", - "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -80664,7 +90440,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "AlignContentKeyword", - "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.", "defaultValue": "'normal'" }, { @@ -80672,7 +90448,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between the stack's children.", "defaultValue": "'none'" }, { @@ -80680,7 +90456,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between rows in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -80688,7 +90464,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between columns in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -80696,7 +90472,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -80704,7 +90480,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -80712,7 +90488,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -80720,7 +90496,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -80728,7 +90504,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -80736,7 +90512,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -80744,7 +90520,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -80752,7 +90528,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -80760,7 +90536,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -80768,7 +90544,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -80776,7 +90552,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -80784,7 +90560,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -80792,7 +90568,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -80800,7 +90576,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -80808,7 +90584,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -80816,7 +90592,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -80824,7 +90600,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -80844,7 +90620,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -80852,7 +90628,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -80860,7 +90636,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -80868,7 +90644,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -80876,14 +90652,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -80891,9 +90667,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -80939,7 +90722,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -80947,32 +90730,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n accessor direction: StackProps['direction'];\n accessor justifyContent: StackProps['justifyContent'];\n accessor alignItems: StackProps['alignItems'];\n accessor alignContent: StackProps['alignContent'];\n accessor gap: StackProps['gap'];\n accessor rowGap: StackProps['rowGap'];\n accessor columnGap: StackProps['columnGap'];\n}" + "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n /**\n * The direction in which the stack's children are arranged.\n */\n direction: StackProps['direction'];\n /**\n * Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n */\n justifyContent: StackProps['justifyContent'];\n /**\n * Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n */\n alignItems: StackProps['alignItems'];\n /**\n * Controls the distribution of lines along the block axis when content wraps into multiple lines.\n */\n alignContent: StackProps['alignContent'];\n /**\n * The spacing between the stack's children.\n */\n gap: StackProps['gap'];\n /**\n * The spacing between rows in the stack.\n */\n rowGap: StackProps['rowGap'];\n /**\n * The spacing between columns in the stack.\n */\n columnGap: StackProps['columnGap'];\n}" }, "Switch": { "filePath": "src/surfaces/admin/components.ts", "name": "Switch", - "description": "Configure the following properties on the switch component.", - "isPublicDocs": true, + "description": "A switch that lets users toggle a setting on or off with a sliding control.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -80987,7 +90791,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -80995,28 +90799,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -81039,7 +90843,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -81047,23 +90851,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -81109,7 +90920,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -81117,24 +90928,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Switch extends PreactCheckboxElement implements SwitchProps {\n accessor labelAccessibilityVisibility: SwitchProps['labelAccessibilityVisibility'];\n constructor();\n}" + "value": "declare class Switch extends SwitchBase implements SwitchProps {\n constructor();\n}" }, "Table": { "filePath": "src/surfaces/admin/components.ts", "name": "Table", - "description": "Configure the following properties on the table component.", - "isPublicDocs": true, + "description": "A component that displays data in a structured table format that automatically adapts to the available space.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "variant", "value": "\"auto\" | \"list\"", - "description": "The layout variant of the table component.\n\n- `list`: Always displays as a list layout.\n- `table`: Always displays as a traditional table layout.\n- `auto`: Automatically displays as a table on wide screens and as a list on narrow screens.", + "description": "The display variant of the table.", "defaultValue": "'auto'" }, { @@ -81142,7 +90967,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table. When `true`, the table might be in an inert state that prevents user interaction.", + "description": "Whether the table is currently in a loading state.", "defaultValue": "false" }, { @@ -81150,7 +90975,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paginate", "value": "boolean", - "description": "Whether to use pagination controls.", + "description": "Whether the pagination controls are displayed.", "defaultValue": "false" }, { @@ -81158,7 +90983,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hasPreviousPage", "value": "boolean", - "description": "Whether there's a previous page of data.", + "description": "Whether there's a previous page of data that the user can navigate to.", "defaultValue": "false" }, { @@ -81166,25 +90991,40 @@ "syntaxKind": "PropertyDeclaration", "name": "hasNextPage", "value": "boolean", - "description": "Whether there's an additional page of data.", + "description": "Whether there's a next page of data that the user can navigate to.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@actualTableVariantSymbol@12105", - "value": "AddedContext", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@actualTableVariantSymbol@17550", + "value": "_shopify_admin_web_component_foundations.AddedContext", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@tableHeadersSharedDataSymbol@12106", - "value": "AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", + "name": "__@tableHeadersSharedDataSymbol@17551", + "value": "_shopify_admin_web_component_foundations.AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -81230,7 +91070,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -81238,78 +91078,171 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Table extends PreactCustomElement implements TableProps {\n accessor variant: TableProps['variant'];\n accessor loading: TableProps['loading'];\n accessor paginate: TableProps['paginate'];\n accessor hasPreviousPage: TableProps['hasPreviousPage'];\n accessor hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" - }, - "AddedContext": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AddedContext", - "description": "", - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "T", - "description": "The current context value.\n\nThe new context value to set, which will notify all consumers." }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "addEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", - "description": "The **`addEventListener()`** method of the EventTarget interface sets up a function that will be called whenever the specified event is delivered to the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener)" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "dispatchEvent", - "value": "(event: Event) => boolean", - "description": "The **`dispatchEvent()`** method of the EventTarget sends an Event to the object, (synchronously) invoking the affected event listeners in the appropriate order.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/dispatchEvent)" + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "removeEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", - "description": "The **`removeEventListener()`** method of the EventTarget interface removes an event listener previously registered with EventTarget.addEventListener() from the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/removeEventListener)" + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AddedContext extends EventTarget {\n constructor(defaultValue: T);\n /**\n * The current context value.\n */\n get value(): T;\n /**\n * The new context value to set, which will notify all consumers.\n */\n set value(value: T);\n}" + "value": "declare class Table extends PolarisCustomElement implements TableProps {\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The display variant of the table.\n */\n variant: TableProps['variant'];\n /**\n * Whether the table is currently in a loading state.\n */\n loading: TableProps['loading'];\n /**\n * Whether the pagination controls are displayed.\n */\n paginate: TableProps['paginate'];\n /**\n * Whether there's a previous page of data that the user can navigate to.\n */\n hasPreviousPage: TableProps['hasPreviousPage'];\n /**\n * Whether there's a next page of data that the user can navigate to.\n */\n hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: _shopify_admin_web_component_foundations.AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: _shopify_admin_web_component_foundations.AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" }, "ActualTableVariant": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ActualTableVariant", "value": "'table' | 'list'", - "description": "Represents the actual rendered variant of a table component.\n- `table`: Displays as a traditional table layout.\n- `list`: Displays as a list layout.", - "isPublicDocs": true + "description": "" }, "ListSlotType": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ListSlotType", "value": "'primary' | 'secondary' | 'kicker' | 'inline' | 'labeled'", - "description": "Represents the semantic type of content slots within list items.\n\n- `primary`: The main content or title of the list item.\n- `secondary`: Supporting or descriptive content below the primary content.\n- `kicker`: A small label or tag displayed above the primary content.\n- `inline`: Content displayed inline with the primary content.\n- `labeled`: Content with an associated label.", - "isPublicDocs": true + "description": "" }, "HeaderFormat": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true }, "TableBody": { "filePath": "src/surfaces/admin/components.ts", "name": "TableBody", - "description": "The table body component represents the main content area of a table, containing the data rows. Use table body as a child of table to structure your table data, with each table row within the body representing a single record or entry.\n\nTable body must contain table row components, which in turn contain table cell components for the actual data values.", - "isPublicDocs": true, + "description": "A component that wraps the body content of a table, which contains the data rows.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class TableBody extends PolarisCustomElement implements TableBodyProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n}" + }, + "TableCell": { + "filePath": "src/surfaces/admin/components.ts", + "name": "TableCell", + "description": "A component that represents a single cell in a table row, which displays data in a format that's determined by its column header.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "__@headerFormatSymbol@17578", + "value": "HeaderFormat", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -81355,7 +91288,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -81363,97 +91296,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - } - ], - "value": "declare class TableBody extends PreactCustomElement implements TableBodyProps {\n constructor();\n}" - }, - "TableCell": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TableCell", - "description": "The table cell component represents a single data cell within a table row. Use table cell as a child of table row to display individual data values, with each cell corresponding to a column in the table.\n\nTable cell automatically inherits styling and alignment from its parent table structure and supports text content or other inline components.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "__@headerFormatSymbol@12128", - "value": "HeaderFormat", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", + "name": "__@flushRenderSymbol@16092", "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableCell extends PreactCustomElement implements TableCellProps {\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" + "value": "declare class TableCell extends PolarisCustomElement implements TableCellProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" }, "TableHeader": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeader", - "description": "The table header component represents a single column header within a table header row. Use table header as a child of table header row to define column headings and optionally enable column sorting.\n\nTable header provides semantic meaning for screen readers and can include sorting controls when configured. Each header corresponds to a column in the table body.", - "isPublicDocs": true, + "description": "A component that defines a column header in a table, which specifies both the header label and how the column's data should be formatted.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "listSlot", "value": "ListSlotType", - "description": "The content designation for this column when the table displays in list variant on mobile devices.", + "description": "The slot where this header's data appears when the table is shown in list view.", "defaultValue": "'labeled'" }, { @@ -81461,7 +91335,22 @@ "syntaxKind": "PropertyDeclaration", "name": "format", "value": "HeaderFormat", - "description": "The format of the column that controls styling and alignment of cell content." + "description": "The format of the header and its corresponding cells." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -81508,7 +91397,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -81516,17 +91405,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeader\n extends PreactCustomElement\n implements TableHeaderProps\n{\n accessor listSlot: TableHeaderProps['listSlot'];\n accessor format: TableHeaderProps['format'];\n constructor();\n}" + "value": "declare class TableHeader\n extends PolarisCustomElement\n implements TableHeaderProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The slot where this header's data appears when the table is shown in list view.\n */\n listSlot: TableHeaderProps['listSlot'];\n /**\n * The format of the header and its corresponding cells.\n */\n format: TableHeaderProps['format'];\n constructor();\n}" }, "TableHeaderRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeaderRow", - "description": "The table header row component represents the header row of a table, containing column headings. Use table header row as the first child of table (before table body) to define the table structure and provide column labels.\n\nTable header row must contain table header components for each column. These headers provide context for the data columns and can support sorting functionality.", - "isPublicDocs": true, + "description": "A component that wraps the header row of a table, which contains the table header components that define the column structure.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -81544,6 +91447,21 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -81573,7 +91491,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -81581,24 +91499,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeaderRow\n extends PreactCustomElement\n implements TableHeaderRowProps\n{\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class TableHeaderRow\n extends PolarisCustomElement\n implements TableHeaderRowProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "TableRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableRow", - "description": "The table row component represents a single row of data within a table body. Use table row as a child of table body to structure individual records or entries in the table.\n\nTable row must contain table cell components, with each cell representing a data value for the corresponding column. The number of cells should match the number of headers in the table.", - "isPublicDocs": true, + "description": "A component that represents a single row in a table, which contains the data cells.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "clickDelegate", "value": "string", - "description": "The ID of an interactive element, such as `s-link`, in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally." + "description": "A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -81645,7 +91592,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -81653,24 +91600,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableRow extends PreactCustomElement implements TableRowProps {\n constructor();\n accessor clickDelegate: string;\n}" + "value": "declare class TableRow extends PolarisCustomElement implements TableRowProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /**\n * A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector.\n */\n clickDelegate: string;\n}" }, "TextArea": { "filePath": "src/surfaces/admin/components.ts", "name": "TextArea", - "description": "Configure the following properties on the text area component.", - "isPublicDocs": true, + "description": "The text area custom element class that renders a multi-line text input field in the Shopify admin interface. This component allows merchants to enter and edit longer text content with support for labels, validation, and length constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -81678,7 +91639,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, { @@ -81686,22 +91647,15 @@ "syntaxKind": "PropertyDeclaration", "name": "rows", "value": "number", - "description": "A number of visible text lines.", + "description": "The number of visible text lines for the field, controlling its initial height.", "defaultValue": "2" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -81709,35 +91663,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -81745,14 +91699,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -81760,7 +91714,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -81784,7 +91738,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -81808,7 +91762,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -81816,23 +91770,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -81870,7 +91838,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -81878,24 +91846,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextArea\n extends PreactFieldElement\n implements TextAreaProps\n{\n accessor maxLength: TextAreaProps['maxLength'];\n accessor minLength: TextAreaProps['minLength'];\n accessor rows: TextAreaProps['rows'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextArea extends TextAreaBase implements TextAreaProps {\n constructor();\n}" }, "TextField": { "filePath": "src/surfaces/admin/components.ts", "name": "TextField", - "description": "Configure the following properties on the text field component.", - "isPublicDocs": true, + "description": "The text field custom element class that renders a single-line text input field in the Shopify admin interface. This component allows merchants to enter and edit text with support for labels, validation, icons, and prefix/suffix content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\" | AnyString", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "value": "IconType | AnyString", + "description": "An icon to display at the start of the text field, providing visual context for the input. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", "defaultValue": "''" }, { @@ -81903,7 +91885,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the merchant can enter in the field. When this limit is reached, the field prevents further input.", "defaultValue": "Infinity" }, { @@ -81911,7 +91893,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation. The field will be considered invalid if the merchant enters fewer characters than this value.", "defaultValue": "0" }, { @@ -81919,7 +91901,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the merchant's input, such as a currency symbol (`$`) or protocol (`https://`).", "defaultValue": "''" }, { @@ -81927,22 +91909,15 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the merchant's input, such as a unit of measurement (`kg`, `%`) or domain (`.myshopify.com`).", "defaultValue": "''" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -81950,35 +91925,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -81986,14 +91961,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -82001,7 +91976,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -82025,7 +92000,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -82049,7 +92024,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -82057,23 +92032,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -82111,7 +92100,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -82119,41 +92108,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextField\n extends PreactFieldElement\n implements TextFieldProps\n{\n accessor icon: TextFieldProps['icon'];\n accessor maxLength: TextFieldProps['maxLength'];\n accessor minLength: TextFieldProps['minLength'];\n accessor prefix: TextFieldProps['prefix'];\n accessor suffix: TextFieldProps['suffix'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextField extends TextFieldBase implements TextFieldProps {\n constructor();\n}" }, "Thumbnail": { "filePath": "src/surfaces/admin/components.ts", "name": "Thumbnail", - "description": "Configure the following properties on the thumbnail component.", - "isPublicDocs": true, + "description": "A thumbnail displays a small preview image with configurable sizing.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display in the thumbnail." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the product thumbnail image.\n\n- `small-200`: Smallest thumbnail size, ideal for compact product lists or tables.\n- `small-100`: Very small thumbnail, suitable for dense layouts.\n- `small`: Small thumbnail for space-constrained contexts.\n- `base`: Default size that balances visibility and space efficiency.\n- `large`: Larger thumbnail for featured products or detailed views.\n- `large-100`: Extra large thumbnail for prominent product display.", + "description": "The size of the thumbnail.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -82199,7 +92209,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -82207,22 +92217,36 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Thumbnail extends PreactCustomElement implements ThumbnailProps {\n accessor src: ThumbnailProps['src'];\n accessor alt: ThumbnailProps['alt'];\n accessor size: ThumbnailProps['size'];\n constructor();\n}" + "value": "declare class Thumbnail extends PolarisCustomElement implements ThumbnailProps {\n /**\n * The URL of the image to display in the thumbnail.\n */\n src: ThumbnailProps['src'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ThumbnailProps['alt'];\n /**\n * The size of the thumbnail.\n */\n size: ThumbnailProps['size'];\n constructor();\n}" }, "Tooltip": { "filePath": "src/surfaces/admin/components.ts", "name": "Tooltip", - "description": "Configure the following properties on the tooltip component.", - "isPublicDocs": true, + "description": "A component that displays a small popup with explanatory text when the user hovers over or focuses on an element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -82230,7 +92254,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -82238,11 +92262,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -82288,7 +92319,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -82296,8 +92327,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Tooltip extends PreactOverlayElement implements TooltipProps {\n constructor();\n}" @@ -82305,9 +92351,15 @@ "UnorderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "UnorderedList", - "description": "Configure the following properties on the unordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a bulleted list of items where the order doesn't matter. Use unordered list when you have a collection of related items without a specific sequence, such as features, options, or bullet points.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -82353,7 +92405,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -82361,32 +92413,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class UnorderedList\n extends PreactCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" + "value": "declare class UnorderedList\n extends PolarisCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" }, "URLField": { "filePath": "src/surfaces/admin/components.ts", "name": "URLField", - "description": "Configure the following properties on the URL field component.", - "isPublicDocs": true, + "description": "The URL field custom element class that renders a URL input field in the Shopify admin interface. This component allows merchants to enter web addresses with automatic URL validation and appropriate mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | `section-${string} url` | `section-${string} photo` | `section-${string} impp` | `section-${string} home impp` | `section-${string} mobile impp` | `section-${string} fax impp` | `section-${string} pager impp` | \"shipping url\" | \"shipping photo\" | \"shipping impp\" | \"shipping home impp\" | \"shipping mobile impp\" | \"shipping fax impp\" | \"shipping pager impp\" | \"billing url\" | \"billing photo\" | \"billing impp\" | \"billing home impp\" | \"billing mobile impp\" | \"billing fax impp\" | \"billing pager impp\" | `section-${string} shipping url` | `section-${string} shipping photo` | `section-${string} shipping impp` | `section-${string} shipping home impp` | `section-${string} shipping mobile impp` | `section-${string} shipping fax impp` | `section-${string} shipping pager impp` | `section-${string} billing url` | `section-${string} billing photo` | `section-${string} billing impp` | `section-${string} billing home impp` | `section-${string} billing mobile impp` | `section-${string} billing fax impp` | `section-${string} billing pager impp` | URLAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint about the intended content of the field for browser autofill.", + "defaultValue": "'url'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the URL.", "defaultValue": "Infinity" }, { @@ -82394,50 +92460,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the URL.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -82445,14 +92504,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -82460,7 +92519,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -82484,7 +92543,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -82508,7 +92567,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -82516,23 +92575,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -82570,7 +92643,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -82578,41 +92651,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class URLField\n extends PreactFieldElement\n implements URLFieldProps\n{\n accessor autocomplete: URLFieldProps['autocomplete'];\n accessor maxLength: URLFieldProps['maxLength'];\n accessor minLength: URLFieldProps['minLength'];\n /**\n * The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class URLField extends URLFieldBase implements URLFieldProps {\n constructor();\n}" }, "URLAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "URLAutocompleteField", "value": "'url' | 'photo' | 'impp' | 'home impp' | 'mobile impp' | 'fax impp' | 'pager impp'", - "description": "Represents autocomplete values that are valid for URL input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for URL inputs.\n\nAvailable values:\n- `url` - General URL or web address\n- `photo` - URL to a photo or image\n- `impp` - Instant messaging protocol URL\n- `home impp` - Home instant messaging protocol URL\n- `mobile impp` - Mobile instant messaging protocol URL\n- `fax impp` - Fax instant messaging protocol URL\n- `pager impp` - Pager instant messaging protocol URL", - "isPublicDocs": true + "description": "" }, "AdminAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminAction", - "description": "Configure the following properties on the admin action component.", - "isPublicDocs": true, + "description": "The admin action custom element class that renders action controls in the Shopify admin interface. This component creates a standardized action area with a heading and slots for primary and secondary action buttons, used exclusively in admin action extensions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text to use as the Action modal's title. If not provided, the name of the extension will be used." + "description": "The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the action is in a loading state, such as during initial page load or when the action is being opened. When `true`, the action might be in an inert state that prevents user interaction.", + "description": "Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -82658,7 +92751,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -82666,11 +92759,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminAction\n extends PreactCustomElement\n implements AdminActionProps\n{\n /**\n * The text to use as the Action modal's title. If not provided, the name of the extension will be used.\n */\n heading: string;\n /**\n * Whether the action is in a loading state, such as during initial page load or when the action is being opened.\n * When `true`, the action might be in an inert state that prevents user interaction.\n */\n loading: boolean;\n constructor();\n}" + "value": "declare class AdminAction\n extends PolarisCustomElement\n implements AdminActionProps\n{\n /**\n * The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading.\n */\n heading: string;\n /**\n * Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.\n *\n * @default false\n */\n loading: boolean;\n constructor();\n}" }, "RunnableExtension": { "filePath": "src/extension.ts", @@ -82883,22 +92991,28 @@ "AdminBlock": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminBlock", - "description": "Configure the following properties on the admin block component.", - "isPublicDocs": true, + "description": "The admin block custom element class that renders a collapsible content block in the Shopify admin interface. This component organizes content into expandable sections with headings and provides a summary when collapsed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text displayed as the block's title in the header. If not provided, the extension name will be used." + "description": "The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "collapsedSummary", "value": "string", - "description": "The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated." + "description": "The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -82945,7 +93059,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -82953,18 +93067,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminBlock\n extends PreactCustomElement\n implements AdminBlockProps\n{\n /**\n * The text displayed as the block's title in the header. If not provided, the extension name will be used.\n */\n heading: string;\n /**\n * The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated.\n */\n collapsedSummary: string;\n constructor();\n}" + "value": "declare class AdminBlock\n extends PolarisCustomElement\n implements AdminBlockProps\n{\n /**\n * The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed.\n */\n heading: string;\n /**\n * The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed.\n */\n collapsedSummary: string;\n constructor();\n}" }, "Form": { "filePath": "src/surfaces/admin/components.ts", "name": "Form", - "description": "Configure the following properties on the form component.", - "isPublicDocs": true, + "description": "The form custom element class that renders a form container in the Shopify admin interface. This component manages form submission, validation, and reset behavior for collecting merchant input.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -83010,7 +93145,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -83018,11 +93153,114 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Form extends PreactCustomElement implements FormProps {\n constructor();\n}" + "value": "declare class Form extends PolarisCustomElement implements FormProps {\n constructor();\n}" + }, + "IntentRenderApi": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderApi", + "description": "The `IntentRenderApi` object provides methods for extensions that render in response to an app intent. Access the intent data to determine what action the merchant requested and use `intents.response` to resolve the intent when complete.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "auth", + "value": "Auth", + "description": "Provides methods for authenticating calls to your app backend. Use the `idToken()` method to retrieve a signed JWT token that verifies the current user's identity for secure server-side operations." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "extension", + "value": "{ target: ExtensionTarget; }", + "description": "The identifier of the running extension target. Use this to determine which target your extension is rendering in and conditionally adjust functionality or UI based on the extension context." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "i18n", + "value": "I18n", + "description": "Utilities for translating content according to the current localization of the admin. Use these methods to provide translated strings that match the merchant's language preferences, ensuring your extension is accessible to a global audience." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "intents", + "value": "IntentRenderIntents", + "description": "Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "picker", + "value": "PickerApi", + "description": "Opens a custom selection dialog with your app-specific data. Use the [Picker API](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/picker-api) to define the picker's heading, items, headers, and selection behavior. Returns a Promise that resolves to a `Picker` object with a `selected` property for accessing the merchant's selection." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "query", + "value": "(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>", + "description": "Executes GraphQL queries against the [GraphQL Admin API](/docs/api/admin-graphql). Use this to fetch shop data, manage resources, or perform mutations. Queries are automatically authenticated with the current user's permissions. Optionally specify GraphQL variables and API version for your query." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "resourcePicker", + "value": "ResourcePickerApi", + "description": "Opens the [resource picker](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/resource-picker-api) modal for selecting products, variants, or collections. Returns the selected resources when the user confirms their selection, or undefined if they cancel." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "storage", + "value": "Storage", + "description": "Provides methods for persisting data in browser storage that is scoped to your extension. Use this to store user preferences, cache data, maintain state across sessions, or save temporary working data. Storage is persistent across page reloads and isolated per extension." + } + ], + "value": "export interface IntentRenderApi\n extends StandardRenderingExtensionApi {\n /**\n * Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow.\n */\n intents: IntentRenderIntents;\n}" + }, + "IntentRenderIntents": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderIntents", + "description": "The intents API available to intent render extensions. Unlike other targets where `response` is optional, intent render extensions always run inside an intent workflow so `response` is guaranteed.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled." + } + ], + "value": "export interface IntentRenderIntents {\n /**\n * Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled.\n */\n response: IntentResponseApi;\n}" + }, + "FormExtensionComponents": { + "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "FormExtensionComponents", + "value": "StandardComponents | 'Form'", + "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." }, "StandardApi": { "filePath": "src/surfaces/admin/api/standard/standard.ts", @@ -83676,19 +93914,18 @@ "value": "FormExtensionComponents | 'FunctionSettings'", "description": "The components available for building function settings extensions. Includes all form components plus the function settings component required for function settings configuration." }, - "FormExtensionComponents": { - "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "FormExtensionComponents", - "value": "StandardComponents | 'Form'", - "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." - }, "FunctionSettings": { "filePath": "src/surfaces/admin/components.ts", "name": "FunctionSettings", - "description": "Configure the following properties on the function settings component.", - "isPublicDocs": true, + "description": "The function settings custom element class that renders a specialized form for configuring Shopify Function settings in the admin interface. This component manages function configuration submission, validation, and error handling.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -83734,7 +93971,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -83742,8 +93979,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class FunctionSettings\n extends PreactCustomElement\n implements FunctionSettingsProps\n{\n constructor();\n}" @@ -83830,15 +94082,21 @@ "AdminPrintAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminPrintAction", - "description": "Configure the following properties on the admin print action component.", - "isPublicDocs": true, + "description": "The admin print action custom element class that renders a print interface in the Shopify admin. This component enables merchants to print content from a specified source URL using the browser's print functionality.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The `src` URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs, and images are supported." + "description": "The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -83885,7 +94143,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -83893,11 +94151,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminPrintAction\n extends PreactCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The `src` URL of the preview and the document to print.\n * If not provided, the preview will show an empty state and the print button will be disabled.\n * HTML, PDFs, and images are supported.\n */\n src: string;\n constructor();\n}" + "value": "declare class AdminPrintAction\n extends PolarisCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action.\n */\n src: string;\n constructor();\n}" }, "ProductDetailsConfigurationApi": { "filePath": "src/surfaces/admin/api/product-configuration/product-details-configuration.ts", @@ -84667,6 +94940,13 @@ "value": "RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >", "description": "A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options." }, + { + "filePath": "src/surfaces/admin/extension-targets.ts", + "syntaxKind": "PropertySignature", + "name": "admin.app.intent.render", + "value": "RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >", + "description": "Renders an admin extension for handling app intents." + }, { "filePath": "src/surfaces/admin/extension-targets.ts", "syntaxKind": "PropertySignature", @@ -85194,7 +95474,7 @@ "description": "A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules." } ], - "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n}" + "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n\n /**\n * Renders an admin extension for handling app intents.\n */\n 'admin.app.intent.render': RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >;\n}" }, "RenderExtension": { "filePath": "src/extension.ts", @@ -85384,9 +95664,17 @@ "value": "string | URL", "description": "The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.", + "isOptional": true } ], - "value": "export interface Intents {\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" + "value": "export interface Intents {\n /**\n * Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.\n */\n response?: IntentResponseApi;\n\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" }, "IntentInvokeApi": { "filePath": "src/surfaces/admin/api/intents/intents.ts", @@ -85396,6 +95684,67 @@ "members": [], "value": "export interface IntentInvokeApi {\n (query: IntentQuery): Promise;\n (intentURL: string, options?: IntentQueryOptions): Promise;\n}" }, + "IntentResponseApi": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "IntentResponseApi", + "description": "The `IntentResponseApi` object provides methods for resolving the current intent from within an invoked extension. This API is only present when your extension is running inside an intent workflow.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "closed", + "value": "() => Promise", + "description": "Resolves the current intent as closed without completing the workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "error", + "value": "(message: string, issues?: Issue[]) => Promise", + "description": "Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "ok", + "value": "(data?: { [key: string]: unknown; }) => Promise", + "description": "Resolves the current intent successfully. Pass output data when your intent defines a response schema." + } + ], + "value": "export interface IntentResponseApi {\n /**\n * Resolves the current intent successfully. Pass output data when your intent defines a response schema.\n */\n ok(data?: SuccessIntentResponse['data']): Promise;\n\n /**\n * Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available.\n */\n error(message: string, issues?: Issue[]): Promise;\n\n /**\n * Resolves the current intent as closed without completing the workflow.\n */\n closed(): Promise;\n}" + }, + "Issue": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "Issue", + "description": "A structured issue describing a validation or workflow error.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "code", + "value": "string", + "description": "A machine-readable error code for this issue. Use this for programmatic error handling or logging.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "message", + "value": "string", + "description": "A description of what's wrong with this field. Display this to help merchants understand how to fix the error.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "path", + "value": "string[]", + "description": "The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure.", + "isOptional": true + } + ], + "value": "export interface Issue {\n /** The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure. */\n path?: string[];\n /** A description of what's wrong with this field. Display this to help merchants understand how to fix the error. */\n message?: string;\n /** A machine-readable error code for this issue. Use this for programmatic error handling or logging. */\n code?: string;\n}" + }, "PickerApi": { "filePath": "src/surfaces/admin/api/picker/picker.ts", "name": "PickerApi", @@ -85889,29 +96238,28 @@ "Avatar": { "filePath": "src/surfaces/admin/components.ts", "name": "Avatar", - "description": "Configure the following properties on the avatar component.", - "isPublicDocs": true, + "description": "An avatar displays a user or entity image with fallback initials when the image isn't available.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "initials", "value": "string", - "description": "The initials to display in the avatar when no image is provided or fails to load. Typically one or two characters representing a person's first and last name initials, such as \"JD\" for John Doe." + "description": "The initials to display when no image is provided or if the image fails to load." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The URL or path to the avatar image. When provided, the image takes priority over `initials`. If the image fails to load or loads slowly, `initials` will be rendered as a fallback." + "description": "The URL of the avatar image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"base\" | \"large\" | \"large-200\"", - "description": "The size of the avatar image.\n\n- `small-200`: Extra small avatar, suitable for compact displays or lists with many items.\n- `small`: Small avatar, good for secondary contexts or tight layouts.\n- `base`: Default size that works well in most contexts.\n- `large`: Large avatar for emphasis or when the avatar is a focal point.\n- `large-200`: Extra large avatar for prominent display.", + "description": "The size of the avatar.", "defaultValue": "'base'" }, { @@ -85919,7 +96267,14 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the avatar for accessibility.\n\nProvides a text description of the avatar for users with assistive technology and serves as a fallback when the avatar fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an avatar, it reads this description aloud. When an avatar fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt)." + "description": "Alternative text that describes the avatar for screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -85966,7 +96321,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -85974,17 +96329,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Avatar extends PreactCustomElement implements AvatarProps {\n accessor initials: AvatarProps['initials'];\n accessor src: AvatarProps['src'];\n accessor size: AvatarProps['size'];\n accessor alt: AvatarProps['alt'];\n constructor();\n}" + "value": "declare class Avatar extends PolarisCustomElement implements AvatarProps {\n /**\n * The initials to display when no image is provided or if the image fails to load.\n */\n initials: AvatarProps['initials'];\n /**\n * The URL of the avatar image to display.\n */\n src: AvatarProps['src'];\n /**\n * The size of the avatar.\n */\n size: AvatarProps['size'];\n /**\n * Alternative text that describes the avatar for screen readers.\n */\n alt: AvatarProps['alt'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -86007,68 +96376,75 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred." + "description": "" } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" }, "Badge": { "filePath": "src/surfaces/admin/components.ts", "name": "Badge", - "description": "Configure the following properties on the badge component.", - "isPublicDocs": true, + "description": "The badge custom element class that renders status indicators in the Shopify admin interface. This component displays compact visual indicators with customizable tones, sizes, and optional icons to communicate status information to merchants.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"strong\"", - "description": "Controls the visual weight and emphasis of the badge.\n\n- `base`: Standard weight with moderate emphasis, suitable for most use cases.\n- `strong`: Increased visual weight for higher emphasis and prominence.", - "defaultValue": "'base'" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the badge to provide additional visual context or reinforce the badge's meaning. Accepts any icon name from the icon library or a custom string identifier." + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"strong\"", + "description": "The visual weight of the badge. Available options: `'base'` for standard weight or `'strong'` for increased emphasis.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the badge.\n\n- `base`: Default size suitable for most badge use cases.\n- `large`: Larger badge for increased visibility and prominence.\n- `large-100`: Extra large badge for maximum visibility in emphasized contexts.", + "description": "The size of the badge. Available options: `'base'` for standard size, `'large'` for larger size, or `'large-100'` for extra large size.", "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", - "defaultValue": "'auto'" + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -86115,7 +96491,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -86123,17 +96499,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Badge extends PreactCustomElement implements BadgeProps {\n accessor color: BadgeProps['color'];\n accessor icon: BadgeProps['icon'];\n accessor size: BadgeProps['size'];\n accessor tone: BadgeProps['tone'];\n constructor();\n}" + "value": "declare class Badge extends BadgeBase implements BadgeProps {\n /**\n * The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: BadgeProps['icon'];\n /**\n * The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.\n */\n tone: BadgeProps['tone'];\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "Banner": { "filePath": "src/surfaces/admin/components.ts", "name": "Banner", - "description": "Configure the following properties on the banner component.", - "isPublicDocs": true, + "description": "A custom element for displaying important messages and notifications.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -86148,7 +96545,7 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.", + "description": "The color tone of the banner based on its semantic meaning.", "defaultValue": "'auto'" }, { @@ -86156,7 +96553,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Controls whether the banner is visible or hidden.\n\nWhen using a controlled component pattern and the banner is `dismissible`, update this property to `true` when the `dismiss` event fires.\n\nYou can hide the banner programmatically by setting this to `true` even if it's not `dismissible`.", + "description": "Whether the banner is hidden from view.", "defaultValue": "false" }, { @@ -86164,9 +96561,16 @@ "syntaxKind": "PropertyDeclaration", "name": "dismissible", "value": "boolean", - "description": "Whether the banner displays a close button that allows users to dismiss it.\n\nWhen the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, any animation completes, and the `afterhide` event fires.", + "description": "Whether the banner can be dismissed by the user.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -86212,7 +96616,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -86220,24 +96624,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Banner extends PreactCustomElement implements BannerProps {\n accessor heading: BannerProps['heading'];\n accessor tone: BannerProps['tone'];\n accessor hidden: BannerProps['hidden'];\n accessor dismissible: BannerProps['dismissible'];\n constructor();\n}" + "value": "declare class Banner extends PolarisCustomElement implements BannerProps {\n /**\n * The heading text displayed at the top of the banner.\n */\n heading: BannerProps['heading'];\n /**\n * The color tone of the banner based on its semantic meaning.\n */\n tone: BannerProps['tone'];\n /**\n * Whether the banner is hidden from view.\n */\n hidden: BannerProps['hidden'];\n /**\n * Whether the banner can be dismissed by the user.\n */\n dismissible: BannerProps['dismissible'];\n constructor();\n}" }, "Box": { "filePath": "src/surfaces/admin/components.ts", "name": "Box", - "description": "Configure the following properties on the box component.", - "isPublicDocs": true, + "description": "A box is a container component that provides control over layout, spacing, and styling.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -86245,7 +96663,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -86253,7 +96671,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -86261,7 +96679,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -86269,7 +96687,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -86277,7 +96695,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -86285,7 +96703,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -86293,7 +96711,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -86301,7 +96719,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -86309,7 +96727,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -86317,7 +96735,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -86325,7 +96743,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -86333,7 +96751,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -86341,7 +96759,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -86349,7 +96767,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -86357,7 +96775,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -86365,7 +96783,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -86385,7 +96803,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -86393,7 +96811,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -86401,7 +96819,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -86409,7 +96827,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -86417,14 +96835,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -86432,9 +96850,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -86480,7 +96905,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -86488,8 +96913,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Box extends BoxElement implements BoxProps {\n constructor();\n}" @@ -86498,120 +96938,106 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -86619,60 +97045,60 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "Button": { "filePath": "src/surfaces/admin/components.ts", "name": "Button", - "description": "Configure the following properties on the button component.", - "isPublicDocs": true, + "description": "The button custom element class that renders interactive buttons in the Shopify admin interface. This component triggers actions or navigation when clicked, with customizable visual styles, states, and optional icons.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", - "defaultValue": "false" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier." + "name": "variant", + "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", + "description": "The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.", + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "loading", - "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", - "defaultValue": "false" + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "variant", - "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "defaultValue": "'auto'" + "name": "disabled", + "value": "boolean", + "description": "Whether the button is disabled, preventing any interaction. When `true`, the button appears visually disabled and doesn't respond to user clicks.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" + "name": "loading", + "value": "boolean", + "description": "Whether the button is in a loading state. When `true`, displays a loading indicator and prevents interaction to show that an action is in progress.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to open the linked document when the button acts as a link. Available options: `''`, `'_blank'`, `'_self'`, `'_parent'`, or `'_top'`.", "defaultValue": "'auto'" }, { @@ -86680,21 +97106,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "A URL that the button should navigate to when clicked. When provided, the button behaves as a link." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Prompts the user to save the linked URL as a file with the specified filename. Only works when `href` is provided." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The button's behavior in forms. Available options: `'button'`, `'submit'`, or `'reset'`.", "defaultValue": "'button'" }, { @@ -86702,7 +97128,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the button's purpose for screen readers. This is essential for accessibility when the button doesn't have visible text." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "inlineSize", + "value": "\"auto\" | \"fill\" | \"fit-content\"", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -86749,7 +97190,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -86757,15 +97198,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -86773,38 +97229,36 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Button extends Button_base implements ButtonProps {\n accessor disabled: ButtonProps['disabled'];\n accessor icon: ButtonProps['icon'];\n accessor loading: ButtonProps['loading'];\n accessor variant: ButtonProps['variant'];\n accessor tone: ButtonProps['tone'];\n accessor target: ButtonProps['target'];\n accessor href: ButtonProps['href'];\n accessor download: ButtonProps['download'];\n accessor type: ButtonProps['type'];\n accessor accessibilityLabel: ButtonProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Button\n extends ButtonBase\n implements ButtonProps\n{\n /**\n * The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: ButtonProps['icon'];\n /**\n * The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.\n */\n variant: ButtonProps['variant'];\n /**\n * The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.\n */\n tone: ButtonProps['tone'];\n constructor();\n}" }, "AnyString": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AnyString", "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true + "description": "Prevents widening string literal types in a union to `string`." }, "ButtonGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "ButtonGroup", - "description": "Configure the following properties on the button group component.", - "isPublicDocs": true, + "description": "A button group that arranges multiple buttons together with consistent spacing and semantic grouping for related actions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "\"base\" | \"none\"", - "description": "The spacing between buttons in the group.\n\n- `base`: Standard spacing that provides clear visual separation between buttons.\n- `none`: No spacing, creating a connected button group.", + "description": "The amount of spacing between buttons in the group, affecting the visual separation of actions.", "defaultValue": "'base'" }, { @@ -86812,7 +97266,21 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, describing the purpose of this group of buttons." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -86838,14 +97306,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -86859,7 +97319,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -86867,39 +97327,68 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ButtonGroup\n extends PreactCustomElement\n implements ButtonGroupProps\n{\n accessor gap: ButtonGroupProps['gap'];\n accessor accessibilityLabel: ButtonGroupProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class ButtonGroup extends ButtonGroupBase implements ButtonGroupProps {\n constructor();\n}" }, "Checkbox": { "filePath": "src/surfaces/admin/components.ts", "name": "Checkbox", - "description": "Configure the following properties on the checkbox component.", - "isPublicDocs": true, + "description": "A checkbox that lets users select or deselect an option, with support for an indeterminate state.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "indeterminate", "value": "boolean", - "description": "Whether the checkbox displays in an indeterminate state (neither checked nor unchecked), typically used to indicate partial selection in hierarchical lists.\n\nThis visual state takes priority over the `checked` prop in appearance only. The form submission value is still determined by the `checked` prop.\n\nIf `indeterminate` has not been explicitly set and hasn't been modified by user interaction, it returns the value of `defaultIndeterminate`." + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultIndeterminate", "value": "boolean", - "description": "The initial indeterminate state for uncontrolled components. Use this when you want the checkbox to start in an indeterminate state but don't need to control it afterward.\n\nThis value applies until `indeterminate` is explicitly set or the user changes the checkbox state by clicking.", + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "labelAccessibilityVisibility", + "value": "\"visible\" | \"exclusive\"", + "description": "", + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -86914,7 +97403,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -86922,28 +97411,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -86966,7 +97455,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -86974,23 +97463,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -87036,7 +97532,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -87044,24 +97540,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Checkbox extends PreactCheckboxElement implements CheckboxProps {\n get indeterminate(): CheckboxProps['indeterminate'];\n set indeterminate(indeterminate: CheckboxProps['indeterminate']);\n accessor defaultIndeterminate: CheckboxProps['defaultIndeterminate'];\n constructor();\n}" + "value": "declare class Checkbox extends CheckboxBase implements CheckboxProps {\n constructor();\n}" + }, + "CallbackEvent": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CallbackEvent", + "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." }, "Chip": { "filePath": "src/surfaces/admin/components.ts", "name": "Chip", - "description": "Configure the following properties on the chip component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "Modify the color to be more or less intense.", "defaultValue": "'base'" }, { @@ -87069,7 +97586,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -87116,7 +97648,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -87124,24 +97656,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Chip extends PreactCustomElement implements ChipProps {\n accessor color: ChipProps['color'];\n accessor accessibilityLabel: ChipProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Chip extends PolarisCustomElement implements ChipProps {\n color: ChipProps['color'];\n accessibilityLabel: ChipProps['accessibilityLabel'];\n removable: ChipProps['removable'];\n constructor(renderImpl?: Omit);\n}" }, "Choice": { "filePath": "src/surfaces/admin/components.ts", "name": "Choice", - "description": "The choice component creates individual selectable options within a choice list. Use choice to define each option that merchants can select, supporting both single selection (radio buttons) and multiple selection (checkboxes) modes.\n\nChoice components support labels, help text, and custom content through slots, providing flexible option presentation within choice lists.", - "isPublicDocs": true, + "description": "A single choice within a choice list that can be selected with a radio button or checkbox.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the choice is disabled and can't be selected.", "defaultValue": "false" }, { @@ -87149,7 +97695,7 @@ "syntaxKind": "GetAccessor", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the choice is currently selected.", "defaultValue": "false" }, { @@ -87157,21 +97703,21 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this choice is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, used when the visual label isn't descriptive enough." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the choice should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -87190,6 +97736,13 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -87219,7 +97772,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -87227,24 +97780,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Choice extends PreactCustomElement implements ChoiceProps {\n accessor disabled: ChoiceProps['disabled'];\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n accessor value: ChoiceProps['value'];\n accessor accessibilityLabel: ChoiceProps['accessibilityLabel'];\n accessor defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Choice extends PolarisCustomElement implements ChoiceProps {\n /**\n * Whether the choice is disabled and can't be selected.\n */\n disabled: ChoiceProps['disabled'];\n /**\n * Whether the choice is currently selected.\n */\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n /**\n * The value that's submitted with the form when this choice is selected.\n */\n value: ChoiceProps['value'];\n /**\n * A label that's only visible to screen readers, used when the visual label isn't descriptive enough.\n */\n accessibilityLabel: ChoiceProps['accessibilityLabel'];\n /**\n * Whether the choice should be selected when it's first rendered.\n */\n defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ChoiceList": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceList", - "description": "Configure the following properties on the choice list component.", - "isPublicDocs": true, + "description": "A list of choices that lets users select one or more options using radio buttons or checkboxes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "addEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", + "description": "Wraps change and input event listeners so they only fire when the event was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n\nThis prevents form events from elements inside secondary content (e.g. TextField, native ) from being mistakenly treated as ChoiceList value-change events, while still allowing those events to bubble normally through the DOM (preserving React's event delegation).", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "removeEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction. When `true`, the `disabled` property on any child choices is ignored.", + "description": "Whether all choices in the list are disabled and can't be selected.", "defaultValue": "false" }, { @@ -87252,43 +97835,43 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name that identifies this choice list when the form is submitted." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the choice list when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the choice list." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "multiple", "value": "boolean", - "description": "Whether multiple choices can be selected.", + "description": "Whether users can select more than one choice at a time.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the choice list is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -87296,7 +97879,7 @@ "syntaxKind": "GetAccessor", "name": "values", "value": "string[]", - "description": "An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected." + "description": "The values of the currently selected choices." }, { "filePath": "src/surfaces/admin/components.ts", @@ -87325,11 +97908,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$3@11434", + "name": "__@internals$3@16769", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -87359,7 +97949,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -87367,38 +97957,52 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ChoiceList extends BaseClass$3 implements ChoiceListProps {\n accessor disabled: ChoiceListProps['disabled'];\n accessor name: ChoiceListProps['name'];\n accessor error: ChoiceListProps['error'];\n accessor details: ChoiceListProps['details'];\n accessor multiple: ChoiceListProps['multiple'];\n accessor label: ChoiceListProps['label'];\n accessor labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class ChoiceList extends BaseClass$1 implements ChoiceListProps {\n /**\n * Wraps change and input event listeners so they only fire when the event\n * was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n *\n * This prevents form events from elements inside secondary content (e.g.\n * TextField, native ) from being mistakenly treated as ChoiceList\n * value-change events, while still allowing those events to bubble normally\n * through the DOM (preserving React's event delegation).\n * @private\n */\n addEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n\n /** @private */\n removeEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: EventListenerOptions | boolean,\n ): void;\n\n /**\n * Whether all choices in the list are disabled and can't be selected.\n */\n disabled: ChoiceListProps['disabled'];\n /**\n * The name that identifies this choice list when the form is submitted.\n */\n name: ChoiceListProps['name'];\n /**\n * An error message that's displayed below the choice list when validation fails.\n */\n error: ChoiceListProps['error'];\n /**\n * Additional text to provide context or guidance for the choice list.\n */\n details: ChoiceListProps['details'];\n /**\n * Whether users can select more than one choice at a time.\n */\n multiple: ChoiceListProps['multiple'];\n /**\n * The text that describes what the choice list is for.\n */\n label: ChoiceListProps['label'];\n /**\n * Controls whether the label is visible to all users or only to screen readers.\n */\n labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n /**\n * The values of the currently selected choices.\n */\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "Clickable": { "filePath": "src/surfaces/admin/components.ts", "name": "Clickable", - "description": "Configure the following properties on the clickable component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the component is disabled, preventing clicks and focus. When disabled, the `click` event won't fire and click events from child elements stop propagating immediately. Interactive child elements can still receive focus and be interacted with. This doesn't apply visual styling by default. You shouldapply disabled styling as needed." + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the component is in a loading state, which indicates to assistive technology that an action is in progress and prevents interaction." + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -87406,21 +98010,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "defaultValue": "'button'" }, { @@ -87428,7 +98032,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -87436,7 +98040,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -87444,7 +98048,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -87452,7 +98056,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -87460,7 +98064,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -87468,7 +98072,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -87476,7 +98080,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -87484,7 +98088,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -87492,7 +98096,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -87500,7 +98104,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -87508,7 +98112,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -87516,7 +98120,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -87524,7 +98128,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -87532,7 +98136,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -87540,7 +98144,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -87548,7 +98152,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -87556,7 +98160,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -87576,7 +98180,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -87584,7 +98188,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -87592,7 +98196,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -87600,7 +98204,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -87608,14 +98212,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -87623,9 +98227,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -87671,7 +98282,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -87679,15 +98290,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -87695,30 +98321,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n accessor disabled: ClickableProps['disabled'];\n accessor loading: ClickableProps['loading'];\n accessor target: ClickableProps['target'];\n accessor href: ClickableProps['href'];\n accessor download: ClickableProps['download'];\n accessor type: ClickableProps['type'];\n constructor();\n}" + "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n disabled: ClickableProps['disabled'];\n loading: ClickableProps['loading'];\n target: ClickableProps['target'];\n href: ClickableProps['href'];\n download: ClickableProps['download'];\n type: ClickableProps['type'];\n constructor();\n}" }, "ClickableChip": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChip", - "description": "Configure the following properties on the clickable chip component.", - "isPublicDocs": true, + "description": "A custom element for displaying interactive chips that can be clicked or removed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "The color of the chip.", "defaultValue": "'base'" }, { @@ -87726,14 +98351,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the chip for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "removable", "value": "boolean", - "description": "Whether the chip displays a remove button for dismissal. When clicked, the `remove` callback fires.", + "description": "Whether the chip can be removed by the user.", "defaultValue": "false" }, { @@ -87741,7 +98366,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Whether the chip is hidden from view. When using controlled component pattern with `removable` chips, update this property when the `remove` event fires. For non-removable chips, manually toggle this property to show or hide the chip.", + "description": "Whether the chip is hidden from view.", "defaultValue": "false" }, { @@ -87749,7 +98374,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the chip is disabled, preventing any user interaction.", + "description": "Whether the chip is disabled and can't be clicked.", "defaultValue": "false" }, { @@ -87757,7 +98382,14 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to navigate to when the chip is clicked." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -87804,7 +98436,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -87812,15 +98444,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -87828,30 +98475,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class ClickableChip\n extends ClickableChip_base\n implements ClickableChipProps\n{\n accessor color: ClickableChipProps['color'];\n accessor accessibilityLabel: ClickableChipProps['accessibilityLabel'];\n accessor removable: ClickableChipProps['removable'];\n accessor hidden: ClickableChipProps['hidden'];\n accessor disabled: ClickableChipProps['disabled'];\n accessor href: ClickableChipProps['href'];\n constructor();\n}" + "value": "declare class ClickableChip\n extends ClickableChipBase\n implements ClickableChipProps\n{\n /**\n * The color of the chip.\n */\n color: ClickableChipProps['color'];\n constructor();\n}" }, "ColorField": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorField", - "description": "Configure the following properties on the color field component.", - "isPublicDocs": true, + "description": "The color field custom element class that renders a color input field with integrated visual picker in the Shopify admin interface. This component allows merchants to select colors by typing hex values or using an interactive color picker, with optional support for transparency (alpha channel).", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -87859,7 +98505,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", @@ -87882,7 +98528,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\"", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -87890,35 +98536,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -87926,14 +98572,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -87941,7 +98587,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -87965,7 +98611,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -87981,7 +98627,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -87989,23 +98635,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -88043,7 +98696,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -88051,24 +98704,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ColorField\n extends PreactFieldElement\n implements ColorFieldProps\n{\n accessor alpha: ColorFieldProps['alpha'];\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n setInternalValue(value: string, normalize: boolean): void;\n}" + "value": "declare class ColorField extends ColorFieldBase implements ColorFieldProps {\n constructor();\n}" }, "ColorPicker": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorPicker", - "description": "Configure the following properties on the color picker component.", - "isPublicDocs": true, + "description": "A visual color picker component that allows users to select colors from a color spectrum interface.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -88076,154 +98743,138 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial color value when the field first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts interacting, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", "name": "formResetCallback", "value": "() => void", - "description": "A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@internals$2@11535", - "value": "ElementInternals", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", "description": "", "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true } ], - "value": "declare class ColorPicker extends BaseClass$2 implements ColorPickerProps {\n accessor alpha: boolean;\n accessor name: string;\n accessor defaultValue: string;\n get value(): string;\n set value(value: string);\n /**\n * A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`.\n */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class ColorPicker extends BaseClass implements ColorPickerProps {\n /**\n * Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.\n *\n * @default false\n */\n alpha: boolean;\n /**\n * The name of the picker, used when submitting form data.\n */\n name: string;\n /**\n * The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n defaultValue: string;\n /**\n * The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n}" }, "DateField": { "filePath": "src/surfaces/admin/components.ts", "name": "DateField", - "description": "Configure the following properties on the date field component.", - "isPublicDocs": true, + "description": "The date field custom element class that renders a date input field with integrated calendar picker in the Shopify admin interface. This component allows merchants to select dates by typing or using a visual calendar, with support for date range restrictions and day-of-week constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar picker, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar picker first opens, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "DateAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -88231,36 +98882,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "defaultValue": "\"\"" + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -88268,14 +98918,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -88283,7 +98933,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -88307,7 +98957,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -88331,7 +98981,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -88339,31 +98989,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected date in `YYYY-MM-DD` format. An empty string means no date is selected.", - "defaultValue": "\"\"" + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -88401,7 +99057,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -88409,78 +99065,139 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DateField\n extends PreactFieldElement\n implements DateFieldProps\n{\n accessor allow: DateFieldProps['allow'];\n accessor disallow: DateFieldProps['disallow'];\n accessor allowDays: DateFieldProps['allowDays'];\n accessor disallowDays: DateFieldProps['disallowDays'];\n set view(view: string);\n get view(): string;\n accessor defaultView: DateFieldProps['defaultView'];\n constructor();\n}" + "value": "declare class DateField extends DateFieldBase implements DateFieldProps {\n constructor();\n}" }, "DateAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "DateAutocompleteField", "value": "'bday-day' | 'bday-month' | 'bday-year' | 'bday' | 'cc-expiry-month' | 'cc-expiry-year' | 'cc-expiry'", - "description": "Represents autocomplete values that are valid for date input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for date-based inputs.\n\nAvailable values:\n- `bday` - Complete birthday date\n- `bday-day` - Day component of a birthday (1-31)\n- `bday-month` - Month component of a birthday (1-12)\n- `bday-year` - Year component of a birthday (1990)\n- `cc-expiry` - Complete credit card expiration date\n- `cc-expiry-month` - Month component of a credit card expiration date (1-12)\n- `cc-expiry-year` - Year component of a credit card expiration date (2025)", - "isPublicDocs": true + "description": "" }, "DatePicker": { "filePath": "src/surfaces/admin/components.ts", "name": "DatePicker", - "description": "Configure the following properties on the date picker component.", - "isPublicDocs": true, + "description": "The date picker custom element class that renders a standalone calendar interface in the Shopify admin. This component allows merchants to select single dates or date ranges using an interactive calendar with month/year navigation, date constraints, and day-of-week restrictions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar first renders, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"single\" | \"range\"", - "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "description": "The type of date selection allowed. Available values: `single`, `range`.", "defaultValue": "\"single\"" }, { @@ -88488,7 +99205,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initially selected date(s) when the component first renders. An empty string means no date is initially selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The initial selected date or date range when the picker first renders, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -88496,14 +99213,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "value", "value": "string", - "description": "The currently selected date(s). An empty string means no date is selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The currently selected date or date range, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -88517,19 +99234,26 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@dirtyStateSymbol@11579", - "value": "boolean", + "name": "__@internals$1@16931", + "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$1@11578", - "value": "ElementInternals", + "name": "__@dirtyStateSymbol@16932", + "value": "boolean", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -88575,7 +99299,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -88583,17 +99307,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DatePicker extends BaseClass$1 implements DatePickerProps {\n accessor defaultView: string;\n set view(view: string);\n get view(): string;\n accessor allow: DatePickerProps['allow'];\n accessor disallow: DatePickerProps['disallow'];\n accessor allowDays: DatePickerProps['allowDays'];\n accessor disallowDays: DatePickerProps['disallowDays'];\n accessor type: DatePickerProps['type'];\n accessor defaultValue: DatePickerProps['defaultValue'];\n accessor name: DatePickerProps['name'];\n set value(value: string);\n get value(): string;\n /** @private */\n [dirtyStateSymbol]: boolean;\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DatePicker\n extends DatePickerBase\n implements DatePickerProps\n{\n constructor();\n}" }, "DropZone": { "filePath": "src/surfaces/admin/components.ts", "name": "DropZone", - "description": "Configure the following properties on the drop zone component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -88615,29 +99353,29 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -88653,14 +99391,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -88690,7 +99428,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@setFiles@11614", + "name": "__@setFiles@16968", "value": "(files: File[]) => void", "description": "", "isPrivate": true @@ -88698,7 +99436,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@getFileInput@11616", + "name": "__@getFileInput@16970", "value": "() => HTMLInputElement", "description": "", "isPrivate": true @@ -88706,11 +99444,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals@11615", + "name": "__@internals@16969", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -88756,7 +99501,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -88764,17 +99509,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DropZone extends BaseClass implements DropZoneProps {\n accessor accept: DropZoneProps['accept'];\n accessor accessibilityLabel: DropZoneProps['accessibilityLabel'];\n accessor disabled: DropZoneProps['disabled'];\n accessor error: DropZoneProps['error'];\n accessor label: DropZoneProps['label'];\n accessor labelAccessibilityVisibility: DropZoneProps['labelAccessibilityVisibility'];\n accessor multiple: DropZoneProps['multiple'];\n accessor name: DropZoneProps['name'];\n accessor required: DropZoneProps['required'];\n get value(): string;\n /** This sets the input value for a file type, which cannot be set programatically, so it can only be reset. */\n set value(value: '' | null);\n get files(): File[];\n set files(files: File[]);\n /** @private */\n [setFiles](files: File[]): void;\n /** @private */\n [getFileInput](): ReplaceType<\n Element | null | undefined,\n Element,\n HTMLInputElement\n >;\n\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DropZone extends DropZoneBase implements DropZoneProps {\n constructor();\n}" }, "Divider": { "filePath": "src/surfaces/admin/components.ts", "name": "Divider", - "description": "Configure the following properties on the divider component.", - "isPublicDocs": true, + "description": "A divider is a visual separator that creates a line between different sections of content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -88792,6 +99551,13 @@ "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -88837,7 +99603,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -88845,32 +99611,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Divider extends PreactCustomElement implements DividerProps {\n accessor direction: DividerProps['direction'];\n accessor color: DividerProps['color'];\n constructor();\n}" + "value": "declare class Divider extends PolarisCustomElement implements DividerProps {\n /**\n * The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n *\n * - `inline`: Horizontal divider for separating vertically stacked content\n * - `block`: Vertical divider for separating horizontally arranged content\n *\n * @default 'inline'\n */\n direction: DividerProps['direction'];\n /**\n * The visual prominence of the divider line.\n *\n * - `base`: Standard divider for most separations (default)\n * - `strong`: More prominent divider for major section breaks\n *\n * @default 'base'\n */\n color: DividerProps['color'];\n constructor();\n}" }, "EmailField": { "filePath": "src/surfaces/admin/components.ts", "name": "EmailField", - "description": "Configure the following properties on the email field component.", - "isPublicDocs": true, + "description": "The email field custom element class that renders an email input field in the Shopify admin interface. This component allows merchants to enter email addresses with automatic validation and optimized mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | EmailAutocompleteField | `section-${string} email` | `section-${string} home email` | `section-${string} mobile email` | `section-${string} fax email` | `section-${string} pager email` | \"shipping email\" | \"shipping home email\" | \"shipping mobile email\" | \"shipping fax email\" | \"shipping pager email\" | \"billing email\" | \"billing home email\" | \"billing mobile email\" | \"billing fax email\" | \"billing pager email\" | `section-${string} shipping email` | `section-${string} shipping home email` | `section-${string} shipping mobile email` | `section-${string} shipping fax email` | `section-${string} shipping pager email` | `section-${string} billing email` | `section-${string} billing home email` | `section-${string} billing mobile email` | `section-${string} billing fax email` | `section-${string} billing pager email`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint as to the intended content of the field for autocomplete purposes.", + "defaultValue": "'email'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -88878,50 +99658,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -88929,14 +99702,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -88944,7 +99717,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -88968,7 +99741,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -88992,7 +99765,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -89000,23 +99773,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -89054,7 +99841,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -89062,32 +99849,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class EmailField\n extends PreactFieldElement\n implements EmailFieldProps\n{\n accessor autocomplete: EmailFieldProps['autocomplete'];\n accessor maxLength: EmailFieldProps['maxLength'];\n accessor minLength: EmailFieldProps['minLength'];\n /**\n * The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class EmailField extends EmailFieldBase implements EmailFieldProps {\n constructor();\n}" }, "EmailAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "EmailAutocompleteField", "value": "'email' | 'home email' | 'mobile email' | 'fax email' | 'pager email'", - "description": "Represents autocomplete values that are valid for email input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for email inputs.\n\nAvailable values:\n- `email` - Primary email address\n- `home email` - Home email address\n- `mobile email` - Mobile device email address\n- `fax email` - Fax machine email address\n- `pager email` - Pager device email address", - "isPublicDocs": true + "description": "" }, "Grid": { "filePath": "src/surfaces/admin/components.ts", "name": "Grid", - "description": "Configure the following properties on the grid component.", - "isPublicDocs": true, + "description": "A grid is a layout component that arranges its children in rows and columns with precise control over sizing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridTemplateColumns", "value": "string", - "description": "The columns in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid columns.", "defaultValue": "'none'" }, { @@ -89095,7 +99895,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridTemplateRows", "value": "string", - "description": "The rows in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid rows.", "defaultValue": "'none'" }, { @@ -89103,7 +99903,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyItems", "value": "\"\" | JustifyItemsKeyword", - "description": "Aligns the grid items along the inline axis.", + "description": "The alignment of grid items along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -89111,7 +99911,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "\"\" | AlignItemsKeyword", - "description": "Aligns the grid items along the block axis.", + "description": "The alignment of grid items along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -89119,7 +99919,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeItems", "value": "AlignItemsKeyword | \"normal normal\" | \"normal stretch\" | \"normal baseline\" | \"normal first baseline\" | \"normal last baseline\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch baseline\" | \"stretch first baseline\" | \"stretch last baseline\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline baseline\" | \"baseline first baseline\" | \"baseline last baseline\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline baseline\" | \"first baseline first baseline\" | \"first baseline last baseline\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline baseline\" | \"last baseline first baseline\" | \"last baseline last baseline\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start baseline\" | \"start first baseline\" | \"start last baseline\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end baseline\" | \"end first baseline\" | \"end last baseline\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center baseline\" | \"center first baseline\" | \"center last baseline\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start baseline\" | \"unsafe start first baseline\" | \"unsafe start last baseline\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end baseline\" | \"unsafe end first baseline\" | \"unsafe end last baseline\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center baseline\" | \"unsafe center first baseline\" | \"unsafe center last baseline\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start baseline\" | \"safe start first baseline\" | \"safe start last baseline\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end baseline\" | \"safe end first baseline\" | \"safe end last baseline\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center baseline\" | \"safe center first baseline\" | \"safe center last baseline\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\"", - "description": "A shorthand property for `justify-items` and `align-items`.", + "description": "A shorthand for setting both `alignItems` and `justifyItems`.", "defaultValue": "'normal normal'" }, { @@ -89127,7 +99927,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "\"\" | JustifyContentKeyword", - "description": "Aligns the grid along the inline axis. This overrides the inline value of `placeContent`.", + "description": "The alignment of the grid along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -89135,7 +99935,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "\"\" | AlignContentKeyword", - "description": "Aligns the grid along the block axis. This overrides the block value of `placeContent`.", + "description": "The alignment of the grid along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -89143,7 +99943,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeContent", "value": "\"normal normal\" | \"normal stretch\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\" | AlignContentKeyword | \"normal space-between\" | \"normal space-around\" | \"normal space-evenly\" | \"baseline space-between\" | \"baseline space-around\" | \"baseline space-evenly\" | \"first baseline space-between\" | \"first baseline space-around\" | \"first baseline space-evenly\" | \"last baseline space-between\" | \"last baseline space-around\" | \"last baseline space-evenly\" | \"start space-between\" | \"start space-around\" | \"start space-evenly\" | \"end space-between\" | \"end space-around\" | \"end space-evenly\" | \"center space-between\" | \"center space-around\" | \"center space-evenly\" | \"unsafe start space-between\" | \"unsafe start space-around\" | \"unsafe start space-evenly\" | \"unsafe end space-between\" | \"unsafe end space-around\" | \"unsafe end space-evenly\" | \"unsafe center space-between\" | \"unsafe center space-around\" | \"unsafe center space-evenly\" | \"safe start space-between\" | \"safe start space-around\" | \"safe start space-evenly\" | \"safe end space-between\" | \"safe end space-around\" | \"safe end space-evenly\" | \"safe center space-between\" | \"safe center space-around\" | \"safe center space-evenly\" | \"stretch space-between\" | \"stretch space-around\" | \"stretch space-evenly\" | \"space-between normal\" | \"space-between start\" | \"space-between end\" | \"space-between center\" | \"space-between unsafe start\" | \"space-between unsafe end\" | \"space-between unsafe center\" | \"space-between safe start\" | \"space-between safe end\" | \"space-between safe center\" | \"space-between stretch\" | \"space-between space-between\" | \"space-between space-around\" | \"space-between space-evenly\" | \"space-around normal\" | \"space-around start\" | \"space-around end\" | \"space-around center\" | \"space-around unsafe start\" | \"space-around unsafe end\" | \"space-around unsafe center\" | \"space-around safe start\" | \"space-around safe end\" | \"space-around safe center\" | \"space-around stretch\" | \"space-around space-between\" | \"space-around space-around\" | \"space-around space-evenly\" | \"space-evenly normal\" | \"space-evenly start\" | \"space-evenly end\" | \"space-evenly center\" | \"space-evenly unsafe start\" | \"space-evenly unsafe end\" | \"space-evenly unsafe center\" | \"space-evenly safe start\" | \"space-evenly safe end\" | \"space-evenly safe center\" | \"space-evenly stretch\" | \"space-evenly space-between\" | \"space-evenly space-around\" | \"space-evenly space-evenly\"", - "description": "A shorthand property for `justify-content` and `align-content`.", + "description": "A shorthand for setting both `alignContent` and `justifyContent`.", "defaultValue": "'normal normal'" }, { @@ -89151,7 +99951,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows and columns.", "defaultValue": "'none'" }, { @@ -89159,7 +99959,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "s spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows.", "defaultValue": "'' - meaning no override" }, { @@ -89167,7 +99967,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid columns.", "defaultValue": "'' - meaning no override" }, { @@ -89175,7 +99975,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -89183,7 +99983,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -89191,7 +99991,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -89199,7 +99999,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -89207,7 +100007,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -89215,7 +100015,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -89223,7 +100023,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -89231,7 +100031,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -89239,7 +100039,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -89247,7 +100047,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -89255,7 +100055,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -89263,7 +100063,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -89271,7 +100071,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -89279,7 +100079,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -89287,7 +100087,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -89295,7 +100095,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -89303,7 +100103,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -89323,7 +100123,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -89331,7 +100131,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -89339,7 +100139,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -89347,7 +100147,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -89355,14 +100155,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -89370,9 +100170,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -89418,7 +100225,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -89426,96 +100233,101 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n accessor gridTemplateColumns: GridProps['gridTemplateColumns'];\n accessor gridTemplateRows: GridProps['gridTemplateRows'];\n accessor justifyItems: GridProps['justifyItems'];\n accessor alignItems: GridProps['alignItems'];\n accessor placeItems: GridProps['placeItems'];\n accessor justifyContent: GridProps['justifyContent'];\n accessor alignContent: GridProps['alignContent'];\n accessor placeContent: GridProps['placeContent'];\n accessor gap: GridProps['gap'];\n accessor rowGap: GridProps['rowGap'];\n accessor columnGap: GridProps['columnGap'];\n}" + "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n /**\n * The template that defines the grid columns.\n */\n gridTemplateColumns: GridProps['gridTemplateColumns'];\n /**\n * The template that defines the grid rows.\n */\n gridTemplateRows: GridProps['gridTemplateRows'];\n /**\n * The alignment of grid items along the inline axis.\n */\n justifyItems: GridProps['justifyItems'];\n /**\n * The alignment of grid items along the block axis.\n */\n alignItems: GridProps['alignItems'];\n /**\n * A shorthand for setting both `alignItems` and `justifyItems`.\n */\n placeItems: GridProps['placeItems'];\n /**\n * The alignment of the grid along the inline axis.\n */\n justifyContent: GridProps['justifyContent'];\n /**\n * The alignment of the grid along the block axis.\n */\n alignContent: GridProps['alignContent'];\n /**\n * A shorthand for setting both `alignContent` and `justifyContent`.\n */\n placeContent: GridProps['placeContent'];\n /**\n * The spacing between grid rows and columns.\n */\n gap: GridProps['gap'];\n /**\n * The spacing between grid rows.\n */\n rowGap: GridProps['rowGap'];\n /**\n * The spacing between grid columns.\n */\n columnGap: GridProps['columnGap'];\n}" }, "JustifyItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.\n\nLearn more about the [justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).", - "isPublicDocs": true + "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis." }, "BaselinePosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BaselinePosition", "value": "'baseline' | 'first baseline' | 'last baseline'", - "description": "Represents baseline alignment positions used to align items relative to their baselines.\n- `baseline`: Aligns to the baseline of the parent.\n- `first baseline`: Aligns to the first baseline of the parent.\n- `last baseline`: Aligns to the last baseline of the parent.", - "isPublicDocs": true + "description": "" }, "OverflowPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "OverflowPosition", "value": "`unsafe ${ContentPosition}` | `safe ${ContentPosition}`", - "description": "Represents content positioning with overflow behavior control. Use `safe` to prevent content from becoming inaccessible when it overflows, or `unsafe` to allow overflow regardless of accessibility.", - "isPublicDocs": true + "description": "" }, "ContentPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentPosition", "value": "'center' | 'start' | 'end'", - "description": "Defines the position of content along an axis.\n- `center`: Centers the content.\n- `start`: Aligns content to the start.\n- `end`: Aligns content to the end.", - "isPublicDocs": true + "description": "" }, "AlignItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Align items sets the align-self value on all direct children as a group.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isPublicDocs": true + "description": "Align items sets the align-self value on all direct children as a group." }, "JustifyContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyContentKeyword", "value": "'normal' | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", - "isPublicDocs": true + "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container." }, "ContentDistribution": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentDistribution", "value": "'space-between' | 'space-around' | 'space-evenly' | 'stretch'", - "description": "Defines how space is distributed between and around content items in flex and grid layouts.\n- `space-between`: Distributes items evenly with the first item at the start and last at the end.\n- `space-around`: Distributes items evenly with equal space around each item.\n- `space-evenly`: Distributes items evenly with equal space between them.\n- `stretch`: Stretches items to fill the container.", - "isPublicDocs": true + "description": "" }, "AlignContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignContentKeyword", "value": "'normal' | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isPublicDocs": true + "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis." }, "SpacingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SpacingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the spacing size between elements, using the standard size scale or `none` for no spacing.", - "isPublicDocs": true + "description": "" }, "GridItem": { "filePath": "src/surfaces/admin/components.ts", "name": "GridItem", - "description": "The grid item component represents a single cell within a grid layout, allowing you to control how content is positioned and sized within the grid. Use grid item as a child of grid to specify column span, row span, and positioning for individual content areas.\n\nGrid item supports precise placement control through column and row properties, enabling you to create complex layouts where different items occupy varying amounts of space or appear in specific grid positions.", - "isPublicDocs": true, + "description": "A grid item is a child of a grid that can be positioned within specific rows and columns.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridColumn", "value": "\"auto\" | `span ${number}`", - "description": "The number of columns the item will span across.\n\nLearn more about the [grid-column property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).", + "description": "The column position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -89523,7 +100335,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridRow", "value": "\"auto\" | `span ${number}`", - "description": "The number of rows the item will span across.\n\nLearn more about the [grid-row property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).", + "description": "The row position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -89531,7 +100343,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -89539,7 +100351,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -89547,7 +100359,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -89555,7 +100367,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -89563,7 +100375,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -89571,7 +100383,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -89579,7 +100391,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -89587,7 +100399,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -89595,7 +100407,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -89603,7 +100415,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -89611,7 +100423,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -89619,7 +100431,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -89627,7 +100439,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -89635,7 +100447,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -89643,7 +100455,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -89651,7 +100463,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -89659,7 +100471,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -89679,7 +100491,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -89687,7 +100499,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -89695,7 +100507,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -89703,7 +100515,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -89711,14 +100523,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -89726,9 +100538,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -89774,7 +100593,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -89782,24 +100601,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class GridItem extends BoxElement implements GridItemProps {\n accessor gridColumn: GridItemProps['gridColumn'];\n accessor gridRow: GridItemProps['gridRow'];\n constructor();\n}" + "value": "declare class GridItem extends BoxElement implements GridItemProps {\n /**\n * The column position and span of the grid item.\n */\n gridColumn: GridItemProps['gridColumn'];\n /**\n * The row position and span of the grid item.\n */\n gridRow: GridItemProps['gridRow'];\n constructor();\n}" }, "Heading": { "filePath": "src/surfaces/admin/components.ts", "name": "Heading", - "description": "Configure the following properties on the heading component.", - "isPublicDocs": true, + "description": "A custom element for displaying hierarchical section titles and headings with appropriate semantic meaning and visual styling. Use Heading to structure your content with proper heading levels for both visual hierarchy and accessibility.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"heading\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The ARIA role for the heading. Set to `'heading'` (the default) for standard heading semantics, or `'presentation'` / `'none'` to remove heading semantics for decorative use.", "defaultValue": "'heading'" }, { @@ -89807,7 +100640,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lineClamp", "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", "defaultValue": "Infinity - no truncation is applied" }, { @@ -89815,9 +100648,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -89863,7 +100703,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -89871,47 +100711,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Heading extends PreactCustomElement implements HeadingProps {\n accessor accessibilityRole: HeadingProps['accessibilityRole'];\n accessor lineClamp: HeadingProps['lineClamp'];\n accessor accessibilityVisibility: HeadingProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Heading extends HeadingBase implements HeadingProps {\n constructor();\n}" }, "Icon": { "filePath": "src/surfaces/admin/components.ts", "name": "Icon", - "description": "Configure the following properties on the icon component.", - "isPublicDocs": true, + "description": "An icon displays a graphical symbol from the icon library.", "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", + "description": "The color tone of the icon based on its semantic meaning.", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "The icon to display from the icon library.\n\nSet to a valid icon name to display that icon. To hide the icon completely, use an empty string `''`. To reserve the icon's space without displaying an icon, use `'empty'`." + "value": "\"\" | IconType", + "description": "The type of icon to display." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color emphasis of the icon.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"base\"", - "description": "The size of the icon.\n\n- `small`: Smaller icon suitable for inline use within text or compact UI elements.\n- `base`: Default size that works well for standalone icons and standard use cases.", + "description": "The size of the icon.", "defaultValue": "'base'" }, { @@ -89919,7 +100773,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The element that this icon should show interest for when activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -89966,7 +100827,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -89974,53 +100835,67 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Icon extends PreactCustomElement implements IconProps {\n accessor color: IconProps['color'];\n accessor tone: IconProps['tone'];\n accessor type: IconProps['type'];\n accessor size: IconProps['size'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Icon extends IconBase implements IconProps {\n /**\n * The color tone of the icon based on its semantic meaning.\n */\n tone: IconProps['tone'];\n /**\n * The type of icon to display.\n */\n type: IconProps['type'];\n constructor();\n}" }, "Image": { "filePath": "src/surfaces/admin/components.ts", "name": "Image", - "description": "Configure the following properties on the image component.", - "isPublicDocs": true, + "description": "An image displays pictures with configurable sizing, loading behavior, and borders.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "srcSet", "value": "string", - "description": "A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n\nLearn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset)." + "description": "A set of source images with different sizes for responsive loading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "sizes", "value": "string", - "description": "A set of media conditions and their corresponding sizes.\n\nLearn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes)." + "description": "The sizes of the image at different viewport widths." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "aspectRatio", "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", - "description": "The aspect ratio of the image.\n\nThe rendering of the image will depend on the `inlineSize` value:\n\n- `inlineSize=\"fill\"`: the aspect ratio will be respected and the image will take the necessary space.\n- `inlineSize=\"auto\"`: the image will not render until it has loaded and the aspect ratio will be ignored.\n\nFor example, if the value is set as `50 / 100`, the getter returns `50 / 100`. If the value is set as `0.5`, the getter returns `0.5 / 1`.\n\nLearn more about the [aspect-ratio property](https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio).", + "description": "The aspect ratio of the image as a width-to-height ratio.", "defaultValue": "'1/1'" }, { @@ -90028,7 +100903,7 @@ "syntaxKind": "PropertyDeclaration", "name": "objectFit", "value": "\"contain\" | \"cover\"", - "description": "The image resizing behavior to fit within its container.\n\n- `contain`: Scales the image to fit within the container while maintaining its aspect ratio. The entire image is visible, but might leave empty space.\n- `cover`: Scales the image to fill the entire container while maintaining its aspect ratio. The image might be cropped to fit.\n\nThe image is always positioned in the center of the container.\n\nLearn more about the [object-fit property](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).", + "description": "How the image should be resized to fit its container.", "defaultValue": "'contain'" }, { @@ -90036,7 +100911,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "\"eager\" | \"lazy\"", - "description": "The loading strategy for the image.\n\n- `eager`: Immediately loads the image, irrespective of its position within the visible viewport.\n- `lazy`: Delays loading the image until it approaches a specified distance from the viewport.\n\nLearn more about the [loading attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading).", + "description": "When the image should be loaded.", "defaultValue": "'eager'" }, { @@ -90044,7 +100919,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"img\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The accessibility role for the image.", "defaultValue": "'img'" }, { @@ -90052,7 +100927,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "\"auto\" | \"fill\"", - "description": "The displayed inline width of the image.\n\n- `fill`: the image will takes up 100% of the available inline size.\n- `auto`: the image will be displayed at its natural size.\n\nLearn more about the [width attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#width).", + "description": "The inline size (width in horizontal writing modes) of the image.", "defaultValue": "'fill'" }, { @@ -90060,35 +100935,23 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied around the image using shorthand syntax to specify width, color, and style in a single property.", - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "description": "Whether to show a border around the image.", + "defaultValue": "'none' - equivalent to `none base auto`." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderWidth", - "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderStyle", - "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image.", "defaultValue": "'' - meaning no override" }, { @@ -90096,17 +100959,24 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "The color of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the image's corners using the design system's radius scale.", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image.", "defaultValue": "'none'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -90152,7 +101022,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -90160,24 +101030,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Image extends PreactCustomElement implements ImageProps {\n accessor src: ImageProps['src'];\n accessor srcSet: ImageProps['srcSet'];\n accessor sizes: ImageProps['sizes'];\n accessor alt: ImageProps['alt'];\n accessor aspectRatio: ImageProps['aspectRatio'];\n accessor objectFit: ImageProps['objectFit'];\n accessor loading: ImageProps['loading'];\n accessor accessibilityRole: ImageProps['accessibilityRole'];\n accessor inlineSize: ImageProps['inlineSize'];\n /**\n * A border applied around the image using shorthand syntax to specify width, color, and style in a single property.\n */\n accessor border: ImageProps['border'];\n /**\n * The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.\n */\n accessor borderWidth: ImageProps['borderWidth'];\n /**\n * The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.\n */\n accessor borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.\n */\n accessor borderColor: ImageProps['borderColor'];\n /**\n * The roundedness of the image's corners using the design system's radius scale.\n */\n accessor borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + "value": "declare class Image extends PolarisCustomElement implements ImageProps {\n /**\n * The URL of the image to display.\n */\n src: ImageProps['src'];\n /**\n * A set of source images with different sizes for responsive loading.\n */\n srcSet: ImageProps['srcSet'];\n /**\n * The sizes of the image at different viewport widths.\n */\n sizes: ImageProps['sizes'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ImageProps['alt'];\n /**\n * The aspect ratio of the image as a width-to-height ratio.\n */\n aspectRatio: ImageProps['aspectRatio'];\n /**\n * How the image should be resized to fit its container.\n */\n objectFit: ImageProps['objectFit'];\n /**\n * When the image should be loaded.\n */\n loading: ImageProps['loading'];\n /**\n * The accessibility role for the image.\n */\n accessibilityRole: ImageProps['accessibilityRole'];\n /**\n * The inline size (width in horizontal writing modes) of the image.\n */\n inlineSize: ImageProps['inlineSize'];\n /**\n * Whether to show a border around the image.\n */\n border: ImageProps['border'];\n /**\n * The width of the border around the image.\n */\n borderWidth: ImageProps['borderWidth'];\n /**\n * The style of the border around the image.\n */\n borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image.\n */\n borderColor: ImageProps['borderColor'];\n /**\n * The radius of the border corners around the image.\n */\n borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + }, + "BorderRadiusKeyword": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "BorderRadiusKeyword", + "value": "SizeKeyword | 'max' | 'none'", + "description": "" }, "Link": { "filePath": "src/surfaces/admin/components.ts", "name": "Link", - "description": "Configure the following properties on the link component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", "defaultValue": "'auto'" }, { @@ -90185,21 +101076,21 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -90207,14 +101098,21 @@ "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "lang", "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)." + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -90261,7 +101159,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -90269,15 +101167,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -90285,24 +101198,30 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Link extends Link_base implements LinkProps {\n accessor tone: LinkProps['tone'];\n accessor accessibilityLabel: LinkProps['accessibilityLabel'];\n accessor href: LinkProps['href'];\n accessor target: LinkProps['target'];\n accessor download: LinkProps['download'];\n accessor lang: LinkProps['lang'];\n constructor();\n}" + "value": "declare class Link extends LinkBase implements LinkProps {\n tone: LinkProps['tone'];\n constructor();\n}" }, "ListItem": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItem", - "description": "The list item component represents a single entry within an ordered list or unordered list. Use list item to structure individual points, steps, or items within a list, with each item automatically receiving appropriate list markers (bullets or numbers) from its parent list.\n\nList item must be used as a direct child of ordered list or unordered list components. Each list item can contain text, inline formatting, or other components to create rich list content.", - "isPublicDocs": true, + "description": "A component that represents a single item within an ordered list or unordered list.\n\nUse list item as a child of ordered list or unordered list to create properly structured and accessible list content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -90348,7 +101267,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -90356,24 +101275,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ListItem extends PreactCustomElement implements ListItemProps {\n constructor();\n}" + "value": "declare class ListItem extends PolarisCustomElement implements ListItemProps {\n constructor();\n}" }, "Menu": { "filePath": "src/surfaces/admin/components.ts", "name": "Menu", - "description": "Configure the following properties on the menu component.", - "isPublicDocs": true, + "description": "A component that displays a contextual list of actions or options, which is typically triggered by a button or other activator element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the menu for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", @@ -90394,7 +101327,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -90402,7 +101335,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -90410,11 +101343,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -90444,7 +101384,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -90452,24 +101392,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n accessor accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n /**\n * A label that describes the menu for assistive technologies.\n */\n accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "MoneyField": { "filePath": "src/surfaces/admin/components.ts", "name": "MoneyField", - "description": "Configure the following properties on the money field component.", - "isPublicDocs": true, + "description": "The money field custom element class that renders a monetary input field in the Shopify admin interface. This component allows merchants to enter currency amounts with automatic formatting, decimal precision, and validation against minimum and maximum values.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum monetary value allowed in the field.", "defaultValue": "Infinity" }, { @@ -90477,9 +101431,17 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum monetary value allowed in the field.", "defaultValue": "-Infinity" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "currencyCode", + "value": "\"auto\" | CurrencyCode", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -90492,7 +101454,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "string", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -90500,35 +101462,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -90536,14 +101498,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -90551,7 +101513,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -90575,7 +101537,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -90599,7 +101561,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -90607,23 +101569,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -90661,7 +101630,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -90669,17 +101638,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class MoneyField\n extends PreactFieldElement\n implements MoneyFieldProps\n{\n accessor max: MoneyFieldProps['max'];\n accessor min: MoneyFieldProps['min'];\n /**\n * The current monetary value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string representing the amount in the store's currency.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class MoneyField extends MoneyFieldBase implements MoneyFieldProps {\n constructor();\n}" + }, + "CurrencyCode": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CurrencyCode", + "value": "'USD' | 'EUR' | 'GBP' | 'CAD' | 'AFN' | 'ALL' | 'DZD' | 'AOA' | 'ARS' | 'AMD' | 'AWG' | 'AUD' | 'BBD' | 'AZN' | 'BDT' | 'BSD' | 'BHD' | 'BIF' | 'BZD' | 'BMD' | 'BTN' | 'BAM' | 'BRL' | 'BOB' | 'BWP' | 'BND' | 'BGN' | 'MMK' | 'KHR' | 'CVE' | 'KYD' | 'XAF' | 'CLP' | 'CNY' | 'COP' | 'KMF' | 'CDF' | 'CRC' | 'HRK' | 'CZK' | 'DKK' | 'DOP' | 'XCD' | 'EGP' | 'ETB' | 'XPF' | 'FJD' | 'GMD' | 'GHS' | 'GTQ' | 'GYD' | 'GEL' | 'HTG' | 'HNL' | 'HKD' | 'HUF' | 'ISK' | 'INR' | 'IDR' | 'ILS' | 'IQD' | 'JMD' | 'JPY' | 'JEP' | 'JOD' | 'KZT' | 'KES' | 'KWD' | 'KGS' | 'LAK' | 'LVL' | 'LBP' | 'LSL' | 'LRD' | 'LTL' | 'MGA' | 'MKD' | 'MOP' | 'MWK' | 'MVR' | 'MXN' | 'MYR' | 'MUR' | 'MDL' | 'MAD' | 'MNT' | 'MZN' | 'NAD' | 'NPR' | 'ANG' | 'NZD' | 'NIO' | 'NGN' | 'NOK' | 'OMR' | 'PAB' | 'PKR' | 'PGK' | 'PYG' | 'PEN' | 'PHP' | 'PLN' | 'QAR' | 'RON' | 'RUB' | 'RWF' | 'WST' | 'SAR' | 'RSD' | 'SCR' | 'SGD' | 'SDG' | 'SYP' | 'ZAR' | 'KRW' | 'SSP' | 'SBD' | 'LKR' | 'SRD' | 'SZL' | 'SEK' | 'CHF' | 'TWD' | 'THB' | 'TZS' | 'TTD' | 'TND' | 'TRY' | 'TMT' | 'UGX' | 'UAH' | 'AED' | 'UYU' | 'UZS' | 'VUV' | 'VND' | 'XOF' | 'YER' | 'ZMW' | 'BYN' | 'BYR' | 'DJF' | 'ERN' | 'FKP' | 'GIP' | 'GNF' | 'IRR' | 'KID' | 'LYD' | 'MRU' | 'SLL' | 'SHP' | 'SOS' | 'STD' | 'STN' | 'TJS' | 'TOP' | 'VED' | 'VEF' | 'VES' | 'XXX'", + "description": "" }, "NumberField": { "filePath": "src/surfaces/admin/components.ts", "name": "NumberField", - "description": "Configure the following properties on the number field component.", - "isPublicDocs": true, + "description": "The number field custom element class that renders a numeric input field in the Shopify admin interface. This component allows merchants to enter numbers with automatic validation and prefix/suffix display.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -90693,7 +101683,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inputMode", "value": "\"decimal\" | \"numeric\"", - "description": "The type of virtual keyboard to display on mobile devices.\n\n- `decimal`: Shows a numeric keyboard with a decimal point, suitable for prices or measurements.\n- `numeric`: Shows a numeric keyboard without a decimal point, suitable for whole numbers like quantities.\n\nLearn more about the [inputmode attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode).", + "description": "The input mode hint for mobile keyboards. Available values include:\n- `numeric`: Shows a numeric keypad optimized for entering numbers\n- `decimal`: Shows a numeric keypad with decimal point support\n- `tel`: Shows a telephone keypad", "defaultValue": "'decimal'" }, { @@ -90701,7 +101691,7 @@ "syntaxKind": "PropertyDeclaration", "name": "step", "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "description": "The granularity that the value must adhere to, or the keyword `any`. This controls the increment/decrement step size.", "defaultValue": "1" }, { @@ -90709,7 +101699,7 @@ "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum numeric value allowed in the field.", "defaultValue": "Infinity" }, { @@ -90717,7 +101707,7 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum numeric value allowed in the field.", "defaultValue": "-Infinity" }, { @@ -90725,7 +101715,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the user's input, such as a currency symbol.", "defaultValue": "''" }, { @@ -90733,7 +101723,7 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the user's input, such as a unit of measurement.", "defaultValue": "''" }, { @@ -90741,7 +101731,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | NumberAutocompleteField | `section-${string} one-time-code` | `section-${string} cc-number` | `section-${string} cc-csc` | \"shipping one-time-code\" | \"shipping cc-number\" | \"shipping cc-csc\" | \"billing one-time-code\" | \"billing cc-number\" | \"billing cc-csc\" | `section-${string} shipping one-time-code` | `section-${string} shipping cc-number` | `section-${string} shipping cc-csc` | `section-${string} billing one-time-code` | `section-${string} billing cc-number` | `section-${string} billing cc-csc`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -90749,35 +101739,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -90785,14 +101775,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -90800,7 +101790,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -90824,7 +101814,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -90848,7 +101838,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -90856,23 +101846,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -90910,7 +101907,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -90918,32 +101915,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class NumberField\n extends PreactFieldElement\n implements NumberFieldProps\n{\n /**\n * The current numeric value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string (decimal or integer).\n */\n get value(): string;\n set value(value: string);\n accessor inputMode: NumberFieldProps['inputMode'];\n accessor step: NumberFieldProps['step'];\n accessor max: NumberFieldProps['max'];\n accessor min: NumberFieldProps['min'];\n accessor prefix: NumberFieldProps['prefix'];\n accessor suffix: NumberFieldProps['suffix'];\n constructor();\n}" + "value": "declare class NumberField extends NumberFieldBase implements NumberFieldProps {\n constructor();\n}" }, "NumberAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "NumberAutocompleteField", "value": "'one-time-code' | 'cc-number' | 'cc-csc'", - "description": "Represents autocomplete values that are valid for number input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for numeric inputs.\n\nAvailable values:\n- `one-time-code` - One-time codes for authentication (OTP, 2FA codes)\n- `cc-number` - Credit card number\n- `cc-csc` - Credit card security code (CVV/CVC)", - "isPublicDocs": true + "description": "" }, "Option": { "filePath": "src/surfaces/admin/components.ts", "name": "Option", - "description": "Represents a single option within a select component. Use only as a child of s-select components.", - "isPublicDocs": true, + "description": "A single option within a select dropdown that users can choose.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the option is currently selected.", "defaultValue": "false" }, { @@ -90951,7 +101961,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the option should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -90959,16 +101969,23 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this option is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the option is disabled and can't be selected.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -91014,7 +102031,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -91022,24 +102039,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Option extends PreactCustomElement implements OptionProps {\n accessor selected: OptionProps['selected'];\n accessor defaultSelected: OptionProps['defaultSelected'];\n accessor value: OptionProps['value'];\n accessor disabled: OptionProps['disabled'];\n constructor();\n}" + "value": "declare class Option extends PolarisCustomElement implements OptionProps {\n /**\n * Whether the option is currently selected.\n */\n selected: OptionProps['selected'];\n /**\n * Whether the option should be selected when it's first rendered.\n */\n defaultSelected: OptionProps['defaultSelected'];\n /**\n * The value that's submitted with the form when this option is selected.\n */\n value: OptionProps['value'];\n /**\n * Whether the option is disabled and can't be selected.\n */\n disabled: OptionProps['disabled'];\n constructor();\n}" }, "OptionGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionGroup", - "description": "Represents a group of options within a select component. Use only as a child of `s-select` components.", - "isPublicDocs": true, + "description": "A group of related options within a select dropdown, displayed with a label.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the options within this group can be selected or not.", + "description": "Whether all options in the group are disabled and can't be selected.", "defaultValue": "false" }, { @@ -91047,7 +102078,14 @@ "syntaxKind": "PropertyDeclaration", "name": "label", "value": "string", - "description": "The user-facing label for this group of options." + "description": "The text that describes what this group of options represents." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -91094,7 +102132,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -91102,18 +102140,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OptionGroup\n extends PreactCustomElement\n implements OptionGroupProps\n{\n accessor disabled: OptionGroupProps['disabled'];\n accessor label: OptionGroupProps['label'];\n constructor();\n}" + "value": "declare class OptionGroup\n extends PolarisCustomElement\n implements OptionGroupProps\n{\n /**\n * Whether all options in the group are disabled and can't be selected.\n */\n disabled: OptionGroupProps['disabled'];\n /**\n * The text that describes what this group of options represents.\n */\n label: OptionGroupProps['label'];\n constructor();\n}" }, "OrderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "OrderedList", - "description": "Configure the following properties on the ordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a numbered list of items with automatic numbering and proper list semantics. Use ordered list when the sequence or order of items matters, such as instructions, rankings, or step-by-step processes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -91159,7 +102218,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -91167,48 +102226,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OrderedList\n extends PreactCustomElement\n implements OrderedListProps\n{\n constructor();\n}" + "value": "declare class OrderedList\n extends PolarisCustomElement\n implements OrderedListProps\n{\n constructor();\n}" }, "Paragraph": { "filePath": "src/surfaces/admin/components.ts", "name": "Paragraph", - "description": "Configure the following properties on the paragraph component.", - "isPublicDocs": true, + "description": "A custom element for displaying blocks of text content with consistent spacing and styling for readable body copy. Use Paragraph to render longer text content with proper line height and spacing between paragraphs.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "lineClamp", - "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", - "defaultValue": "Infinity - no truncation is applied" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the paragraph text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"caution\"", - "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "lineClamp", + "value": "number", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", + "defaultValue": "Infinity - no truncation is applied" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color of the paragraph text.", "defaultValue": "'base'" }, { @@ -91216,7 +102289,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -91224,9 +102297,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -91272,7 +102352,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -91280,24 +102360,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Paragraph extends PreactCustomElement implements ParagraphProps {\n accessor fontVariantNumeric: ParagraphProps['fontVariantNumeric'];\n accessor lineClamp: ParagraphProps['lineClamp'];\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: ParagraphProps['tone'];\n\n accessor color: ParagraphProps['color'];\n accessor dir: ParagraphProps['dir'];\n accessor accessibilityVisibility: ParagraphProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Paragraph extends ParagraphBase implements ParagraphProps {\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: ParagraphProps['tone'];\n constructor();\n}" }, "PasswordField": { "filePath": "src/surfaces/admin/components.ts", "name": "PasswordField", - "description": "Configure the following properties on the password field component.", - "isPublicDocs": true, + "description": "The password field custom element class that renders a password input field in the Shopify admin interface. This component allows merchants to enter passwords securely with characters automatically masked for privacy.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the password.", "defaultValue": "Infinity" }, { @@ -91305,22 +102399,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the password.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | PasswordAutocompleteField | `section-${string} current-password` | `section-${string} new-password` | \"shipping current-password\" | \"shipping new-password\" | \"billing current-password\" | \"billing new-password\" | `section-${string} shipping current-password` | `section-${string} shipping new-password` | `section-${string} billing current-password` | `section-${string} billing new-password`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -91328,35 +102415,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -91364,14 +102451,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -91379,7 +102466,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -91403,7 +102490,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -91427,7 +102514,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -91435,23 +102522,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -91489,7 +102590,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -91497,34 +102598,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class PasswordField\n extends PreactFieldElement\n implements PasswordFieldProps\n{\n accessor maxLength: PasswordFieldProps['maxLength'];\n accessor minLength: PasswordFieldProps['minLength'];\n /**\n * The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class PasswordField\n extends PasswordFieldBase\n implements PasswordFieldProps\n{\n constructor();\n}" }, "PasswordAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PasswordAutocompleteField", "value": "'current-password' | 'new-password'", - "description": "Represents autocomplete values that are valid for password input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for password inputs.\n\nAvailable values:\n- `current-password` - Existing password for login or authentication\n- `new-password` - New password when creating an account or changing password", - "isPublicDocs": true + "description": "" }, "QueryContainer": { "filePath": "src/surfaces/admin/components.ts", "name": "QueryContainer", - "description": "Configure the following properties on the query container component.", - "isPublicDocs": true, + "description": "A component that sets up a container query context, which lets child elements style themselves based on the container's size instead of the viewport size.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "containerName", "value": "string", - "description": "An identifier for this container that you can reference in CSS container queries to apply styles based on this specific container's size.\n\nAll query container components automatically receive a container name of `s-default`. You can omit the container name in your queries, so `@container (inline-size <= 300px)` is equivalent to `@container s-default (inline-size <= 300px)`.\n\nWhen you provide a custom `containerName`, it's added alongside `s-default`. For example, `containerName=\"product-card\"` results in `s-default product-card` being set on the `container-name` CSS property, allowing you to target this container with `@container product-card (inline-size <= 300px)`.\n\nLearn more about the [container-name property](https://developer.mozilla.org/en-US/docs/Web/CSS/container-name).", + "description": "The name of the container, which you can reference in CSS container queries.", "defaultValue": "''" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -91570,7 +102691,245 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class QueryContainer\n extends PolarisCustomElement\n implements QueryContainerProps\n{\n /**\n * The name of the container, which you can reference in CSS container queries.\n */\n containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" + }, + "SearchField": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SearchField", + "description": "A search field that lets users enter search queries with a search-specific input type.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "maxLength", + "value": "number", + "description": "The maximum number of characters that can be entered in the field.", + "defaultValue": "Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "minLength", + "value": "number", + "description": "The minimum number of characters that must be entered for the field to be valid.", + "defaultValue": "0" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "autocomplete", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "details", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "error", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "label", + "value": "any", + "description": "Content to use as the field label." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "labelAccessibilityVisibility", + "value": "\"visible\" | \"exclusive\"", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "getAttribute", + "value": "(qualifiedName: string) => string", + "description": "Global keyboard event handlers for things like key bindings typically ignore keystrokes originating from within input elements. Unfortunately, these never account for a Custom Element being the input element.\n\nTo fix this, we spoof getAttribute & hasAttribute to make a PreactFieldElement appear as a contentEditable \"input\" when it contains a focused input element.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "hasAttribute", + "value": "(qualifiedName: string) => boolean", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "isContentEditable", + "value": "boolean", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "formResetCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "id", + "value": "string", + "description": "A unique identifier for the element." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@internals$4@16693", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -91578,242 +102937,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class QueryContainer\n extends PreactCustomElement\n implements QueryContainerProps\n{\n accessor containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" - }, - "SearchField": { - "filePath": "src/surfaces/admin/components.ts", - "name": "SearchField", - "description": "Configure the following properties on the search field component.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "maxLength", - "value": "number", - "description": "The maximum number of characters allowed in the field.", - "defaultValue": "Infinity" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "minLength", - "value": "number", - "description": "The minimum number of characters required in the field.", - "defaultValue": "0" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "defaultValue", - "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "labelAccessibilityVisibility", - "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", - "defaultValue": "'visible'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "placeholder", - "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "readOnly", - "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", - "defaultValue": "false" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "required", - "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", - "defaultValue": "false" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "getAttribute", - "value": "(qualifiedName: string) => string", - "description": "Global keyboard event handlers for things like key bindings typically ignore keystrokes originating from within input elements. Unfortunately, these never account for a Custom Element being the input element.\n\nTo fix this, we spoof getAttribute & hasAttribute to make a PreactFieldElement appear as a contentEditable \"input\" when it contains a focused input element.", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "hasAttribute", - "value": "(qualifiedName: string) => boolean", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "isContentEditable", - "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "formResetCallback", - "value": "() => void", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", + "name": "__@flushRenderSymbol@16092", "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", - "defaultValue": "false" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "id", - "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "name", - "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", - "value": "ElementInternals", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class SearchField\n extends PreactFieldElement\n implements SearchFieldProps\n{\n accessor maxLength: SearchFieldProps['maxLength'];\n accessor minLength: SearchFieldProps['minLength'];\n /**\n * The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class SearchField extends SearchFieldBase implements SearchFieldProps {\n constructor();\n}" }, "TextAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" }, "Section": { "filePath": "src/surfaces/admin/components.ts", "name": "Section", - "description": "Configure the following properties on the section component.", - "isPublicDocs": true, + "description": "A section is a container that groups related content together with an optional heading.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -91823,28 +102978,43 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "The accessibility label for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The heading text displayed at the top of the section. This heading provides a title for the section's content and automatically uses the appropriate semantic heading level (h2, h3, h4) based on nesting depth to maintain proper document structure." + "description": "The heading text for the section." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "\"base\" | \"none\"", - "description": "The padding applied to all edges of the element.\n\n- `base`: applies padding that is appropriate for the element. Note that it might result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the section need to span to the edge of the section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "description": "Whether the section has padding.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -91861,14 +103031,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -91882,7 +103044,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -91890,59 +103052,73 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Section extends PreactCustomElement implements SectionProps {\n constructor();\n /** @private */\n connectedCallback(): void;\n accessor accessibilityLabel: SectionProps['accessibilityLabel'];\n accessor heading: SectionProps['heading'];\n accessor padding: SectionProps['padding'];\n}" + "value": "declare class Section extends SectionBase implements SectionProps {\n constructor();\n}" }, "Select": { "filePath": "src/surfaces/admin/components.ts", "name": "Select", - "description": "Configure the following properties on the select component.", - "isPublicDocs": true, + "description": "A select dropdown that lets users choose one option from a list.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier." + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the select." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the select when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the select is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "Text that appears in the select when no option is selected to provide a hint about what to choose." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether an option must be selected before the form can be submitted.", "defaultValue": "false" }, { @@ -91950,7 +103126,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -91974,7 +103150,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component." + "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected Option component." }, { "filePath": "src/surfaces/admin/components.ts", @@ -91987,15 +103163,15 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@usedFirstOptionSymbol@12029", + "name": "__@usedFirstOptionSymbol@17470", "value": "boolean", - "description": "A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n\nThis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.", + "description": "used to determine if no value or defaultValue was set, in which case the first non-disabled option was used\n\nthis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@hasInitialValueSymbol@12030", + "name": "__@hasInitialValueSymbol@17471", "value": "boolean", "description": "", "isPrivate": true @@ -92005,7 +103181,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -92013,23 +103189,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -92059,7 +103242,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -92067,33 +103250,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Select extends PreactInputElement implements SelectProps {\n accessor icon: SelectProps['icon'];\n accessor details: SelectProps['details'];\n accessor error: SelectProps['error'];\n accessor label: SelectProps['label'];\n accessor placeholder: SelectProps['placeholder'];\n accessor required: SelectProps['required'];\n accessor labelAccessibilityVisibility: SelectProps['labelAccessibilityVisibility'];\n /** @private */\n connectedCallback(): void;\n /**\n * A lifecycle callback that fires when the component is removed from the DOM. Performs cleanup operations.\n * @private\n */\n disconnectedCallback(): void;\n constructor();\n /**\n * A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n *\n * This is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.\n * @private\n */\n [usedFirstOptionSymbol]: boolean;\n /**\n * @private\n */\n [hasInitialValueSymbol]: boolean;\n /**\n * The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component.\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n}" + "value": "declare class Select extends SelectBase implements SelectProps {\n constructor();\n}" }, "Spinner": { "filePath": "src/surfaces/admin/components.ts", "name": "Spinner", - "description": "Configure the following properties on the spinner component.", - "isPublicDocs": true, + "description": "A component that displays an animated loading indicator to show that content is currently being processed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the spinner for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the loading spinner.\n\n- `base`: Default size suitable for inline loading indicators or standard UI contexts.\n- `large`: Larger spinner for more prominent loading states.\n- `large-100`: Extra large spinner for full-page or emphasized loading states.", + "description": "The size of the spinner.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -92139,7 +103343,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -92147,24 +103351,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Spinner extends PreactCustomElement implements SpinnerProps {\n accessor accessibilityLabel: string;\n accessor size: SpinnerProps['size'];\n constructor();\n}" + "value": "declare class Spinner extends PolarisCustomElement implements SpinnerProps {\n /**\n * A label that describes the spinner for assistive technologies.\n */\n accessibilityLabel: string;\n /**\n * The size of the spinner.\n */\n size: SpinnerProps['size'];\n constructor();\n}" }, "Stack": { "filePath": "src/surfaces/admin/components.ts", "name": "Stack", - "description": "Configure the following properties on the stack component.", - "isPublicDocs": true, + "description": "A stack is a layout component that arranges its children in a single direction with controlled spacing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "direction", "value": "MaybeResponsive<\"inline\" | \"block\">", - "description": "The direction in which the stack's children are placed within the stack.\n\nAccepts:\n- A single value, either `inline` or `block`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported direction values as a query value", + "description": "The direction in which the stack's children are arranged.", "defaultValue": "'block'" }, { @@ -92172,7 +103390,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "JustifyContentKeyword", - "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -92180,7 +103398,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "AlignItemsKeyword", - "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -92188,7 +103406,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "AlignContentKeyword", - "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.", "defaultValue": "'normal'" }, { @@ -92196,7 +103414,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between the stack's children.", "defaultValue": "'none'" }, { @@ -92204,7 +103422,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between rows in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -92212,7 +103430,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between columns in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -92220,7 +103438,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -92228,7 +103446,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -92236,7 +103454,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -92244,7 +103462,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -92252,7 +103470,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -92260,7 +103478,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -92268,7 +103486,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -92276,7 +103494,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -92284,7 +103502,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -92292,7 +103510,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -92300,7 +103518,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -92308,7 +103526,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -92316,7 +103534,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -92324,7 +103542,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -92332,7 +103550,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -92340,7 +103558,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -92348,7 +103566,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -92368,7 +103586,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -92376,7 +103594,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -92384,7 +103602,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -92392,7 +103610,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -92400,14 +103618,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -92415,9 +103633,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -92463,7 +103688,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -92471,32 +103696,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n accessor direction: StackProps['direction'];\n accessor justifyContent: StackProps['justifyContent'];\n accessor alignItems: StackProps['alignItems'];\n accessor alignContent: StackProps['alignContent'];\n accessor gap: StackProps['gap'];\n accessor rowGap: StackProps['rowGap'];\n accessor columnGap: StackProps['columnGap'];\n}" + "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n /**\n * The direction in which the stack's children are arranged.\n */\n direction: StackProps['direction'];\n /**\n * Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n */\n justifyContent: StackProps['justifyContent'];\n /**\n * Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n */\n alignItems: StackProps['alignItems'];\n /**\n * Controls the distribution of lines along the block axis when content wraps into multiple lines.\n */\n alignContent: StackProps['alignContent'];\n /**\n * The spacing between the stack's children.\n */\n gap: StackProps['gap'];\n /**\n * The spacing between rows in the stack.\n */\n rowGap: StackProps['rowGap'];\n /**\n * The spacing between columns in the stack.\n */\n columnGap: StackProps['columnGap'];\n}" }, "Switch": { "filePath": "src/surfaces/admin/components.ts", "name": "Switch", - "description": "Configure the following properties on the switch component.", - "isPublicDocs": true, + "description": "A switch that lets users toggle a setting on or off with a sliding control.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -92511,7 +103757,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -92519,28 +103765,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -92563,7 +103809,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -92571,23 +103817,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -92633,7 +103886,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -92641,24 +103894,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Switch extends PreactCheckboxElement implements SwitchProps {\n accessor labelAccessibilityVisibility: SwitchProps['labelAccessibilityVisibility'];\n constructor();\n}" + "value": "declare class Switch extends SwitchBase implements SwitchProps {\n constructor();\n}" }, "Table": { "filePath": "src/surfaces/admin/components.ts", "name": "Table", - "description": "Configure the following properties on the table component.", - "isPublicDocs": true, + "description": "A component that displays data in a structured table format that automatically adapts to the available space.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "variant", "value": "\"auto\" | \"list\"", - "description": "The layout variant of the table component.\n\n- `list`: Always displays as a list layout.\n- `table`: Always displays as a traditional table layout.\n- `auto`: Automatically displays as a table on wide screens and as a list on narrow screens.", + "description": "The display variant of the table.", "defaultValue": "'auto'" }, { @@ -92666,7 +103933,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table. When `true`, the table might be in an inert state that prevents user interaction.", + "description": "Whether the table is currently in a loading state.", "defaultValue": "false" }, { @@ -92674,7 +103941,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paginate", "value": "boolean", - "description": "Whether to use pagination controls.", + "description": "Whether the pagination controls are displayed.", "defaultValue": "false" }, { @@ -92682,7 +103949,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hasPreviousPage", "value": "boolean", - "description": "Whether there's a previous page of data.", + "description": "Whether there's a previous page of data that the user can navigate to.", "defaultValue": "false" }, { @@ -92690,25 +103957,40 @@ "syntaxKind": "PropertyDeclaration", "name": "hasNextPage", "value": "boolean", - "description": "Whether there's an additional page of data.", + "description": "Whether there's a next page of data that the user can navigate to.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@actualTableVariantSymbol@12105", - "value": "AddedContext", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@actualTableVariantSymbol@17550", + "value": "_shopify_admin_web_component_foundations.AddedContext", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@tableHeadersSharedDataSymbol@12106", - "value": "AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", + "name": "__@tableHeadersSharedDataSymbol@17551", + "value": "_shopify_admin_web_component_foundations.AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -92754,7 +104036,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -92762,78 +104044,69 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Table extends PreactCustomElement implements TableProps {\n accessor variant: TableProps['variant'];\n accessor loading: TableProps['loading'];\n accessor paginate: TableProps['paginate'];\n accessor hasPreviousPage: TableProps['hasPreviousPage'];\n accessor hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" - }, - "AddedContext": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AddedContext", - "description": "", - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "T", - "description": "The current context value.\n\nThe new context value to set, which will notify all consumers." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "addEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", - "description": "The **`addEventListener()`** method of the EventTarget interface sets up a function that will be called whenever the specified event is delivered to the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener)" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "dispatchEvent", - "value": "(event: Event) => boolean", - "description": "The **`dispatchEvent()`** method of the EventTarget sends an Event to the object, (synchronously) invoking the affected event listeners in the appropriate order.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/dispatchEvent)" + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "removeEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", - "description": "The **`removeEventListener()`** method of the EventTarget interface removes an event listener previously registered with EventTarget.addEventListener() from the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/removeEventListener)" + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AddedContext extends EventTarget {\n constructor(defaultValue: T);\n /**\n * The current context value.\n */\n get value(): T;\n /**\n * The new context value to set, which will notify all consumers.\n */\n set value(value: T);\n}" + "value": "declare class Table extends PolarisCustomElement implements TableProps {\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The display variant of the table.\n */\n variant: TableProps['variant'];\n /**\n * Whether the table is currently in a loading state.\n */\n loading: TableProps['loading'];\n /**\n * Whether the pagination controls are displayed.\n */\n paginate: TableProps['paginate'];\n /**\n * Whether there's a previous page of data that the user can navigate to.\n */\n hasPreviousPage: TableProps['hasPreviousPage'];\n /**\n * Whether there's a next page of data that the user can navigate to.\n */\n hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: _shopify_admin_web_component_foundations.AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: _shopify_admin_web_component_foundations.AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" }, "ActualTableVariant": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ActualTableVariant", "value": "'table' | 'list'", - "description": "Represents the actual rendered variant of a table component.\n- `table`: Displays as a traditional table layout.\n- `list`: Displays as a list layout.", - "isPublicDocs": true + "description": "" }, "ListSlotType": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ListSlotType", "value": "'primary' | 'secondary' | 'kicker' | 'inline' | 'labeled'", - "description": "Represents the semantic type of content slots within list items.\n\n- `primary`: The main content or title of the list item.\n- `secondary`: Supporting or descriptive content below the primary content.\n- `kicker`: A small label or tag displayed above the primary content.\n- `inline`: Content displayed inline with the primary content.\n- `labeled`: Content with an associated label.", - "isPublicDocs": true + "description": "" }, "HeaderFormat": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true }, "TableBody": { "filePath": "src/surfaces/admin/components.ts", "name": "TableBody", - "description": "The table body component represents the main content area of a table, containing the data rows. Use table body as a child of table to structure your table data, with each table row within the body representing a single record or entry.\n\nTable body must contain table row components, which in turn contain table cell components for the actual data values.", - "isPublicDocs": true, + "description": "A component that wraps the body content of a table, which contains the data rows.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -92879,7 +104152,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -92887,26 +104160,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableBody extends PreactCustomElement implements TableBodyProps {\n constructor();\n}" + "value": "declare class TableBody extends PolarisCustomElement implements TableBodyProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n}" }, "TableCell": { "filePath": "src/surfaces/admin/components.ts", "name": "TableCell", - "description": "The table cell component represents a single data cell within a table row. Use table cell as a child of table row to display individual data values, with each cell corresponding to a column in the table.\n\nTable cell automatically inherits styling and alignment from its parent table structure and supports text content or other inline components.", - "isPublicDocs": true, + "description": "A component that represents a single cell in a table row, which displays data in a format that's determined by its column header.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", - "name": "__@headerFormatSymbol@12128", + "name": "__@headerFormatSymbol@17578", "value": "HeaderFormat", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -92952,7 +104254,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -92960,24 +104262,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableCell extends PreactCustomElement implements TableCellProps {\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" + "value": "declare class TableCell extends PolarisCustomElement implements TableCellProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" }, "TableHeader": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeader", - "description": "The table header component represents a single column header within a table header row. Use table header as a child of table header row to define column headings and optionally enable column sorting.\n\nTable header provides semantic meaning for screen readers and can include sorting controls when configured. Each header corresponds to a column in the table body.", - "isPublicDocs": true, + "description": "A component that defines a column header in a table, which specifies both the header label and how the column's data should be formatted.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "listSlot", "value": "ListSlotType", - "description": "The content designation for this column when the table displays in list variant on mobile devices.", + "description": "The slot where this header's data appears when the table is shown in list view.", "defaultValue": "'labeled'" }, { @@ -92985,7 +104301,22 @@ "syntaxKind": "PropertyDeclaration", "name": "format", "value": "HeaderFormat", - "description": "The format of the column that controls styling and alignment of cell content." + "description": "The format of the header and its corresponding cells." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -93032,7 +104363,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -93040,17 +104371,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeader\n extends PreactCustomElement\n implements TableHeaderProps\n{\n accessor listSlot: TableHeaderProps['listSlot'];\n accessor format: TableHeaderProps['format'];\n constructor();\n}" + "value": "declare class TableHeader\n extends PolarisCustomElement\n implements TableHeaderProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The slot where this header's data appears when the table is shown in list view.\n */\n listSlot: TableHeaderProps['listSlot'];\n /**\n * The format of the header and its corresponding cells.\n */\n format: TableHeaderProps['format'];\n constructor();\n}" }, "TableHeaderRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeaderRow", - "description": "The table header row component represents the header row of a table, containing column headings. Use table header row as the first child of table (before table body) to define the table structure and provide column labels.\n\nTable header row must contain table header components for each column. These headers provide context for the data columns and can support sorting functionality.", - "isPublicDocs": true, + "description": "A component that wraps the header row of a table, which contains the table header components that define the column structure.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -93068,6 +104413,21 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -93097,7 +104457,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -93105,24 +104465,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeaderRow\n extends PreactCustomElement\n implements TableHeaderRowProps\n{\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class TableHeaderRow\n extends PolarisCustomElement\n implements TableHeaderRowProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "TableRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableRow", - "description": "The table row component represents a single row of data within a table body. Use table row as a child of table body to structure individual records or entries in the table.\n\nTable row must contain table cell components, with each cell representing a data value for the corresponding column. The number of cells should match the number of headers in the table.", - "isPublicDocs": true, + "description": "A component that represents a single row in a table, which contains the data cells.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "clickDelegate", "value": "string", - "description": "The ID of an interactive element, such as `s-link`, in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally." + "description": "A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -93169,7 +104558,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -93177,41 +104566,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableRow extends PreactCustomElement implements TableRowProps {\n constructor();\n accessor clickDelegate: string;\n}" + "value": "declare class TableRow extends PolarisCustomElement implements TableRowProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /**\n * A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector.\n */\n clickDelegate: string;\n}" }, "Text": { "filePath": "src/surfaces/admin/components.ts", "name": "Text", - "description": "Configure the following properties on the text component.", - "isPublicDocs": true, + "description": "A custom element for displaying inline or small blocks of text with various visual styles and semantic meanings. Use Text to render short pieces of content with appropriate styling, emphasis, and color treatment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color of the text.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", @@ -93226,7 +104629,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -93234,7 +104637,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, { @@ -93242,7 +104645,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The ID of an element this text provides contextual information for." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -93289,7 +104699,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -93297,24 +104707,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Text extends PreactCustomElement implements TextProps {\n accessor fontVariantNumeric: TextProps['fontVariantNumeric'];\n accessor color: TextProps['color'];\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: TextProps['tone'];\n /**\n * The semantic type and styling treatment for the text content.\n *\n * - `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n * - `generic`: Standard text with no special semantic meaning or styling.\n * - `address`: Marks the text as contact information, such as a physical or email address.\n * - `redundant`: Indicates the text is redundant or duplicated information for screen reader context.\n */\n accessor type: TextProps['type'];\n accessor dir: TextProps['dir'];\n accessor accessibilityVisibility: TextProps['accessibilityVisibility'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Text extends TextBase implements TextProps {\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: TextProps['tone'];\n constructor();\n}" }, "TextArea": { "filePath": "src/surfaces/admin/components.ts", "name": "TextArea", - "description": "Configure the following properties on the text area component.", - "isPublicDocs": true, + "description": "The text area custom element class that renders a multi-line text input field in the Shopify admin interface. This component allows merchants to enter and edit longer text content with support for labels, validation, and length constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -93322,7 +104746,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, { @@ -93330,22 +104754,15 @@ "syntaxKind": "PropertyDeclaration", "name": "rows", "value": "number", - "description": "A number of visible text lines.", + "description": "The number of visible text lines for the field, controlling its initial height.", "defaultValue": "2" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -93353,35 +104770,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -93389,14 +104806,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -93404,7 +104821,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -93428,7 +104845,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -93452,7 +104869,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -93460,23 +104877,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -93514,7 +104945,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -93522,24 +104953,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextArea\n extends PreactFieldElement\n implements TextAreaProps\n{\n accessor maxLength: TextAreaProps['maxLength'];\n accessor minLength: TextAreaProps['minLength'];\n accessor rows: TextAreaProps['rows'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextArea extends TextAreaBase implements TextAreaProps {\n constructor();\n}" }, "TextField": { "filePath": "src/surfaces/admin/components.ts", "name": "TextField", - "description": "Configure the following properties on the text field component.", - "isPublicDocs": true, + "description": "The text field custom element class that renders a single-line text input field in the Shopify admin interface. This component allows merchants to enter and edit text with support for labels, validation, icons, and prefix/suffix content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\" | AnyString", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "value": "IconType | AnyString", + "description": "An icon to display at the start of the text field, providing visual context for the input. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", "defaultValue": "''" }, { @@ -93547,7 +104992,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the merchant can enter in the field. When this limit is reached, the field prevents further input.", "defaultValue": "Infinity" }, { @@ -93555,7 +105000,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation. The field will be considered invalid if the merchant enters fewer characters than this value.", "defaultValue": "0" }, { @@ -93563,7 +105008,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the merchant's input, such as a currency symbol (`$`) or protocol (`https://`).", "defaultValue": "''" }, { @@ -93571,22 +105016,15 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the merchant's input, such as a unit of measurement (`kg`, `%`) or domain (`.myshopify.com`).", "defaultValue": "''" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -93594,35 +105032,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -93630,14 +105068,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -93645,7 +105083,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -93669,7 +105107,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -93693,7 +105131,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -93701,23 +105139,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -93755,7 +105207,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -93763,41 +105215,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextField\n extends PreactFieldElement\n implements TextFieldProps\n{\n accessor icon: TextFieldProps['icon'];\n accessor maxLength: TextFieldProps['maxLength'];\n accessor minLength: TextFieldProps['minLength'];\n accessor prefix: TextFieldProps['prefix'];\n accessor suffix: TextFieldProps['suffix'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextField extends TextFieldBase implements TextFieldProps {\n constructor();\n}" }, "Thumbnail": { "filePath": "src/surfaces/admin/components.ts", "name": "Thumbnail", - "description": "Configure the following properties on the thumbnail component.", - "isPublicDocs": true, + "description": "A thumbnail displays a small preview image with configurable sizing.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display in the thumbnail." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the product thumbnail image.\n\n- `small-200`: Smallest thumbnail size, ideal for compact product lists or tables.\n- `small-100`: Very small thumbnail, suitable for dense layouts.\n- `small`: Small thumbnail for space-constrained contexts.\n- `base`: Default size that balances visibility and space efficiency.\n- `large`: Larger thumbnail for featured products or detailed views.\n- `large-100`: Extra large thumbnail for prominent product display.", + "description": "The size of the thumbnail.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -93843,7 +105316,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -93851,22 +105324,36 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Thumbnail extends PreactCustomElement implements ThumbnailProps {\n accessor src: ThumbnailProps['src'];\n accessor alt: ThumbnailProps['alt'];\n accessor size: ThumbnailProps['size'];\n constructor();\n}" + "value": "declare class Thumbnail extends PolarisCustomElement implements ThumbnailProps {\n /**\n * The URL of the image to display in the thumbnail.\n */\n src: ThumbnailProps['src'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ThumbnailProps['alt'];\n /**\n * The size of the thumbnail.\n */\n size: ThumbnailProps['size'];\n constructor();\n}" }, "Tooltip": { "filePath": "src/surfaces/admin/components.ts", "name": "Tooltip", - "description": "Configure the following properties on the tooltip component.", - "isPublicDocs": true, + "description": "A component that displays a small popup with explanatory text when the user hovers over or focuses on an element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -93874,7 +105361,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -93882,11 +105369,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -93932,7 +105426,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -93940,8 +105434,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Tooltip extends PreactOverlayElement implements TooltipProps {\n constructor();\n}" @@ -93949,9 +105458,15 @@ "UnorderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "UnorderedList", - "description": "Configure the following properties on the unordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a bulleted list of items where the order doesn't matter. Use unordered list when you have a collection of related items without a specific sequence, such as features, options, or bullet points.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -93997,7 +105512,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -94005,32 +105520,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class UnorderedList\n extends PreactCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" + "value": "declare class UnorderedList\n extends PolarisCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" }, "URLField": { "filePath": "src/surfaces/admin/components.ts", "name": "URLField", - "description": "Configure the following properties on the URL field component.", - "isPublicDocs": true, + "description": "The URL field custom element class that renders a URL input field in the Shopify admin interface. This component allows merchants to enter web addresses with automatic URL validation and appropriate mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | `section-${string} url` | `section-${string} photo` | `section-${string} impp` | `section-${string} home impp` | `section-${string} mobile impp` | `section-${string} fax impp` | `section-${string} pager impp` | \"shipping url\" | \"shipping photo\" | \"shipping impp\" | \"shipping home impp\" | \"shipping mobile impp\" | \"shipping fax impp\" | \"shipping pager impp\" | \"billing url\" | \"billing photo\" | \"billing impp\" | \"billing home impp\" | \"billing mobile impp\" | \"billing fax impp\" | \"billing pager impp\" | `section-${string} shipping url` | `section-${string} shipping photo` | `section-${string} shipping impp` | `section-${string} shipping home impp` | `section-${string} shipping mobile impp` | `section-${string} shipping fax impp` | `section-${string} shipping pager impp` | `section-${string} billing url` | `section-${string} billing photo` | `section-${string} billing impp` | `section-${string} billing home impp` | `section-${string} billing mobile impp` | `section-${string} billing fax impp` | `section-${string} billing pager impp` | URLAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint about the intended content of the field for browser autofill.", + "defaultValue": "'url'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the URL.", "defaultValue": "Infinity" }, { @@ -94038,50 +105567,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the URL.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -94089,14 +105611,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -94104,7 +105626,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -94128,7 +105650,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -94152,7 +105674,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -94160,23 +105682,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -94214,7 +105750,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -94222,41 +105758,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class URLField\n extends PreactFieldElement\n implements URLFieldProps\n{\n accessor autocomplete: URLFieldProps['autocomplete'];\n accessor maxLength: URLFieldProps['maxLength'];\n accessor minLength: URLFieldProps['minLength'];\n /**\n * The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class URLField extends URLFieldBase implements URLFieldProps {\n constructor();\n}" }, "URLAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "URLAutocompleteField", "value": "'url' | 'photo' | 'impp' | 'home impp' | 'mobile impp' | 'fax impp' | 'pager impp'", - "description": "Represents autocomplete values that are valid for URL input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for URL inputs.\n\nAvailable values:\n- `url` - General URL or web address\n- `photo` - URL to a photo or image\n- `impp` - Instant messaging protocol URL\n- `home impp` - Home instant messaging protocol URL\n- `mobile impp` - Mobile instant messaging protocol URL\n- `fax impp` - Fax instant messaging protocol URL\n- `pager impp` - Pager instant messaging protocol URL", - "isPublicDocs": true + "description": "" }, "AdminAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminAction", - "description": "Configure the following properties on the admin action component.", - "isPublicDocs": true, + "description": "The admin action custom element class that renders action controls in the Shopify admin interface. This component creates a standardized action area with a heading and slots for primary and secondary action buttons, used exclusively in admin action extensions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text to use as the Action modal's title. If not provided, the name of the extension will be used." + "description": "The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the action is in a loading state, such as during initial page load or when the action is being opened. When `true`, the action might be in an inert state that prevents user interaction.", + "description": "Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -94302,7 +105858,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -94310,11 +105866,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminAction\n extends PreactCustomElement\n implements AdminActionProps\n{\n /**\n * The text to use as the Action modal's title. If not provided, the name of the extension will be used.\n */\n heading: string;\n /**\n * Whether the action is in a loading state, such as during initial page load or when the action is being opened.\n * When `true`, the action might be in an inert state that prevents user interaction.\n */\n loading: boolean;\n constructor();\n}" + "value": "declare class AdminAction\n extends PolarisCustomElement\n implements AdminActionProps\n{\n /**\n * The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading.\n */\n heading: string;\n /**\n * Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.\n *\n * @default false\n */\n loading: boolean;\n constructor();\n}" }, "RunnableExtension": { "filePath": "src/extension.ts", @@ -94527,22 +106098,28 @@ "AdminBlock": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminBlock", - "description": "Configure the following properties on the admin block component.", - "isPublicDocs": true, + "description": "The admin block custom element class that renders a collapsible content block in the Shopify admin interface. This component organizes content into expandable sections with headings and provides a summary when collapsed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text displayed as the block's title in the header. If not provided, the extension name will be used." + "description": "The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "collapsedSummary", "value": "string", - "description": "The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated." + "description": "The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -94589,7 +106166,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -94597,18 +106174,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminBlock\n extends PreactCustomElement\n implements AdminBlockProps\n{\n /**\n * The text displayed as the block's title in the header. If not provided, the extension name will be used.\n */\n heading: string;\n /**\n * The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated.\n */\n collapsedSummary: string;\n constructor();\n}" + "value": "declare class AdminBlock\n extends PolarisCustomElement\n implements AdminBlockProps\n{\n /**\n * The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed.\n */\n heading: string;\n /**\n * The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed.\n */\n collapsedSummary: string;\n constructor();\n}" }, "Form": { "filePath": "src/surfaces/admin/components.ts", "name": "Form", - "description": "Configure the following properties on the form component.", - "isPublicDocs": true, + "description": "The form custom element class that renders a form container in the Shopify admin interface. This component manages form submission, validation, and reset behavior for collecting merchant input.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -94654,7 +106252,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -94662,11 +106260,114 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Form extends PreactCustomElement implements FormProps {\n constructor();\n}" + "value": "declare class Form extends PolarisCustomElement implements FormProps {\n constructor();\n}" + }, + "IntentRenderApi": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderApi", + "description": "The `IntentRenderApi` object provides methods for extensions that render in response to an app intent. Access the intent data to determine what action the merchant requested and use `intents.response` to resolve the intent when complete.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "auth", + "value": "Auth", + "description": "Provides methods for authenticating calls to your app backend. Use the `idToken()` method to retrieve a signed JWT token that verifies the current user's identity for secure server-side operations." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "extension", + "value": "{ target: ExtensionTarget; }", + "description": "The identifier of the running extension target. Use this to determine which target your extension is rendering in and conditionally adjust functionality or UI based on the extension context." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "i18n", + "value": "I18n", + "description": "Utilities for translating content according to the current localization of the admin. Use these methods to provide translated strings that match the merchant's language preferences, ensuring your extension is accessible to a global audience." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "intents", + "value": "IntentRenderIntents", + "description": "Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "picker", + "value": "PickerApi", + "description": "Opens a custom selection dialog with your app-specific data. Use the [Picker API](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/picker-api) to define the picker's heading, items, headers, and selection behavior. Returns a Promise that resolves to a `Picker` object with a `selected` property for accessing the merchant's selection." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "query", + "value": "(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>", + "description": "Executes GraphQL queries against the [GraphQL Admin API](/docs/api/admin-graphql). Use this to fetch shop data, manage resources, or perform mutations. Queries are automatically authenticated with the current user's permissions. Optionally specify GraphQL variables and API version for your query." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "resourcePicker", + "value": "ResourcePickerApi", + "description": "Opens the [resource picker](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/resource-picker-api) modal for selecting products, variants, or collections. Returns the selected resources when the user confirms their selection, or undefined if they cancel." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "storage", + "value": "Storage", + "description": "Provides methods for persisting data in browser storage that is scoped to your extension. Use this to store user preferences, cache data, maintain state across sessions, or save temporary working data. Storage is persistent across page reloads and isolated per extension." + } + ], + "value": "export interface IntentRenderApi\n extends StandardRenderingExtensionApi {\n /**\n * Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow.\n */\n intents: IntentRenderIntents;\n}" + }, + "IntentRenderIntents": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderIntents", + "description": "The intents API available to intent render extensions. Unlike other targets where `response` is optional, intent render extensions always run inside an intent workflow so `response` is guaranteed.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled." + } + ], + "value": "export interface IntentRenderIntents {\n /**\n * Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled.\n */\n response: IntentResponseApi;\n}" + }, + "FormExtensionComponents": { + "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "FormExtensionComponents", + "value": "StandardComponents | 'Form'", + "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." }, "StandardApi": { "filePath": "src/surfaces/admin/api/standard/standard.ts", @@ -95320,19 +107021,18 @@ "value": "FormExtensionComponents | 'FunctionSettings'", "description": "The components available for building function settings extensions. Includes all form components plus the function settings component required for function settings configuration." }, - "FormExtensionComponents": { - "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "FormExtensionComponents", - "value": "StandardComponents | 'Form'", - "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." - }, "FunctionSettings": { "filePath": "src/surfaces/admin/components.ts", "name": "FunctionSettings", - "description": "Configure the following properties on the function settings component.", - "isPublicDocs": true, + "description": "The function settings custom element class that renders a specialized form for configuring Shopify Function settings in the admin interface. This component manages function configuration submission, validation, and error handling.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -95378,7 +107078,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -95386,8 +107086,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class FunctionSettings\n extends PreactCustomElement\n implements FunctionSettingsProps\n{\n constructor();\n}" @@ -95474,15 +107189,21 @@ "AdminPrintAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminPrintAction", - "description": "Configure the following properties on the admin print action component.", - "isPublicDocs": true, + "description": "The admin print action custom element class that renders a print interface in the Shopify admin. This component enables merchants to print content from a specified source URL using the browser's print functionality.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The `src` URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs, and images are supported." + "description": "The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -95529,7 +107250,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -95537,11 +107258,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminPrintAction\n extends PreactCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The `src` URL of the preview and the document to print.\n * If not provided, the preview will show an empty state and the print button will be disabled.\n * HTML, PDFs, and images are supported.\n */\n src: string;\n constructor();\n}" + "value": "declare class AdminPrintAction\n extends PolarisCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action.\n */\n src: string;\n constructor();\n}" }, "ProductDetailsConfigurationApi": { "filePath": "src/surfaces/admin/api/product-configuration/product-details-configuration.ts", @@ -96785,6 +108521,13 @@ "value": "RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >", "description": "A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options." }, + { + "filePath": "src/surfaces/admin/extension-targets.ts", + "syntaxKind": "PropertySignature", + "name": "admin.app.intent.render", + "value": "RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >", + "description": "Renders an admin extension for handling app intents." + }, { "filePath": "src/surfaces/admin/extension-targets.ts", "syntaxKind": "PropertySignature", @@ -97312,7 +109055,7 @@ "description": "A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules." } ], - "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n}" + "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n\n /**\n * Renders an admin extension for handling app intents.\n */\n 'admin.app.intent.render': RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >;\n}" }, "RenderExtension": { "filePath": "src/extension.ts", @@ -97486,9 +109229,17 @@ "value": "string | URL", "description": "The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.", + "isOptional": true } ], - "value": "export interface Intents {\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" + "value": "export interface Intents {\n /**\n * Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.\n */\n response?: IntentResponseApi;\n\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" }, "IntentInvokeApi": { "filePath": "src/surfaces/admin/api/intents/intents.ts", @@ -97498,6 +109249,67 @@ "members": [], "value": "export interface IntentInvokeApi {\n (query: IntentQuery): Promise;\n (intentURL: string, options?: IntentQueryOptions): Promise;\n}" }, + "IntentResponseApi": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "IntentResponseApi", + "description": "The `IntentResponseApi` object provides methods for resolving the current intent from within an invoked extension. This API is only present when your extension is running inside an intent workflow.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "closed", + "value": "() => Promise", + "description": "Resolves the current intent as closed without completing the workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "error", + "value": "(message: string, issues?: Issue[]) => Promise", + "description": "Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "ok", + "value": "(data?: { [key: string]: unknown; }) => Promise", + "description": "Resolves the current intent successfully. Pass output data when your intent defines a response schema." + } + ], + "value": "export interface IntentResponseApi {\n /**\n * Resolves the current intent successfully. Pass output data when your intent defines a response schema.\n */\n ok(data?: SuccessIntentResponse['data']): Promise;\n\n /**\n * Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available.\n */\n error(message: string, issues?: Issue[]): Promise;\n\n /**\n * Resolves the current intent as closed without completing the workflow.\n */\n closed(): Promise;\n}" + }, + "Issue": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "Issue", + "description": "A structured issue describing a validation or workflow error.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "code", + "value": "string", + "description": "A machine-readable error code for this issue. Use this for programmatic error handling or logging.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "message", + "value": "string", + "description": "A description of what's wrong with this field. Display this to help merchants understand how to fix the error.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "path", + "value": "string[]", + "description": "The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure.", + "isOptional": true + } + ], + "value": "export interface Issue {\n /** The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure. */\n path?: string[];\n /** A description of what's wrong with this field. Display this to help merchants understand how to fix the error. */\n message?: string;\n /** A machine-readable error code for this issue. Use this for programmatic error handling or logging. */\n code?: string;\n}" + }, "PickerApi": { "filePath": "src/surfaces/admin/api/picker/picker.ts", "name": "PickerApi", @@ -97991,29 +109803,28 @@ "Avatar": { "filePath": "src/surfaces/admin/components.ts", "name": "Avatar", - "description": "Configure the following properties on the avatar component.", - "isPublicDocs": true, + "description": "An avatar displays a user or entity image with fallback initials when the image isn't available.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "initials", "value": "string", - "description": "The initials to display in the avatar when no image is provided or fails to load. Typically one or two characters representing a person's first and last name initials, such as \"JD\" for John Doe." + "description": "The initials to display when no image is provided or if the image fails to load." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The URL or path to the avatar image. When provided, the image takes priority over `initials`. If the image fails to load or loads slowly, `initials` will be rendered as a fallback." + "description": "The URL of the avatar image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"base\" | \"large\" | \"large-200\"", - "description": "The size of the avatar image.\n\n- `small-200`: Extra small avatar, suitable for compact displays or lists with many items.\n- `small`: Small avatar, good for secondary contexts or tight layouts.\n- `base`: Default size that works well in most contexts.\n- `large`: Large avatar for emphasis or when the avatar is a focal point.\n- `large-200`: Extra large avatar for prominent display.", + "description": "The size of the avatar.", "defaultValue": "'base'" }, { @@ -98021,7 +109832,14 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the avatar for accessibility.\n\nProvides a text description of the avatar for users with assistive technology and serves as a fallback when the avatar fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an avatar, it reads this description aloud. When an avatar fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt)." + "description": "Alternative text that describes the avatar for screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -98068,7 +109886,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -98076,17 +109894,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Avatar extends PreactCustomElement implements AvatarProps {\n accessor initials: AvatarProps['initials'];\n accessor src: AvatarProps['src'];\n accessor size: AvatarProps['size'];\n accessor alt: AvatarProps['alt'];\n constructor();\n}" + "value": "declare class Avatar extends PolarisCustomElement implements AvatarProps {\n /**\n * The initials to display when no image is provided or if the image fails to load.\n */\n initials: AvatarProps['initials'];\n /**\n * The URL of the avatar image to display.\n */\n src: AvatarProps['src'];\n /**\n * The size of the avatar.\n */\n size: AvatarProps['size'];\n /**\n * Alternative text that describes the avatar for screen readers.\n */\n alt: AvatarProps['alt'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -98109,68 +109941,75 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred." + "description": "" } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" }, "Badge": { "filePath": "src/surfaces/admin/components.ts", "name": "Badge", - "description": "Configure the following properties on the badge component.", - "isPublicDocs": true, + "description": "The badge custom element class that renders status indicators in the Shopify admin interface. This component displays compact visual indicators with customizable tones, sizes, and optional icons to communicate status information to merchants.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"strong\"", - "description": "Controls the visual weight and emphasis of the badge.\n\n- `base`: Standard weight with moderate emphasis, suitable for most use cases.\n- `strong`: Increased visual weight for higher emphasis and prominence.", - "defaultValue": "'base'" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the badge to provide additional visual context or reinforce the badge's meaning. Accepts any icon name from the icon library or a custom string identifier." + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"strong\"", + "description": "The visual weight of the badge. Available options: `'base'` for standard weight or `'strong'` for increased emphasis.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the badge.\n\n- `base`: Default size suitable for most badge use cases.\n- `large`: Larger badge for increased visibility and prominence.\n- `large-100`: Extra large badge for maximum visibility in emphasized contexts.", + "description": "The size of the badge. Available options: `'base'` for standard size, `'large'` for larger size, or `'large-100'` for extra large size.", "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", - "defaultValue": "'auto'" + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -98217,7 +110056,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -98225,17 +110064,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Badge extends PreactCustomElement implements BadgeProps {\n accessor color: BadgeProps['color'];\n accessor icon: BadgeProps['icon'];\n accessor size: BadgeProps['size'];\n accessor tone: BadgeProps['tone'];\n constructor();\n}" + "value": "declare class Badge extends BadgeBase implements BadgeProps {\n /**\n * The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: BadgeProps['icon'];\n /**\n * The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.\n */\n tone: BadgeProps['tone'];\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "Banner": { "filePath": "src/surfaces/admin/components.ts", "name": "Banner", - "description": "Configure the following properties on the banner component.", - "isPublicDocs": true, + "description": "A custom element for displaying important messages and notifications.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -98250,7 +110110,7 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.", + "description": "The color tone of the banner based on its semantic meaning.", "defaultValue": "'auto'" }, { @@ -98258,7 +110118,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Controls whether the banner is visible or hidden.\n\nWhen using a controlled component pattern and the banner is `dismissible`, update this property to `true` when the `dismiss` event fires.\n\nYou can hide the banner programmatically by setting this to `true` even if it's not `dismissible`.", + "description": "Whether the banner is hidden from view.", "defaultValue": "false" }, { @@ -98266,9 +110126,16 @@ "syntaxKind": "PropertyDeclaration", "name": "dismissible", "value": "boolean", - "description": "Whether the banner displays a close button that allows users to dismiss it.\n\nWhen the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, any animation completes, and the `afterhide` event fires.", + "description": "Whether the banner can be dismissed by the user.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -98314,7 +110181,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -98322,24 +110189,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Banner extends PreactCustomElement implements BannerProps {\n accessor heading: BannerProps['heading'];\n accessor tone: BannerProps['tone'];\n accessor hidden: BannerProps['hidden'];\n accessor dismissible: BannerProps['dismissible'];\n constructor();\n}" + "value": "declare class Banner extends PolarisCustomElement implements BannerProps {\n /**\n * The heading text displayed at the top of the banner.\n */\n heading: BannerProps['heading'];\n /**\n * The color tone of the banner based on its semantic meaning.\n */\n tone: BannerProps['tone'];\n /**\n * Whether the banner is hidden from view.\n */\n hidden: BannerProps['hidden'];\n /**\n * Whether the banner can be dismissed by the user.\n */\n dismissible: BannerProps['dismissible'];\n constructor();\n}" }, "Box": { "filePath": "src/surfaces/admin/components.ts", "name": "Box", - "description": "Configure the following properties on the box component.", - "isPublicDocs": true, + "description": "A box is a container component that provides control over layout, spacing, and styling.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -98347,7 +110228,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -98355,7 +110236,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -98363,7 +110244,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -98371,7 +110252,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -98379,7 +110260,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -98387,7 +110268,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -98395,7 +110276,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -98403,7 +110284,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -98411,7 +110292,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -98419,7 +110300,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -98427,7 +110308,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -98435,7 +110316,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -98443,7 +110324,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -98451,7 +110332,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -98459,7 +110340,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -98467,7 +110348,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -98487,7 +110368,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -98495,7 +110376,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -98503,7 +110384,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -98511,7 +110392,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -98519,14 +110400,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -98534,9 +110415,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -98582,7 +110470,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -98590,8 +110478,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Box extends BoxElement implements BoxProps {\n constructor();\n}" @@ -98600,120 +110503,106 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -98721,60 +110610,60 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "Button": { "filePath": "src/surfaces/admin/components.ts", "name": "Button", - "description": "Configure the following properties on the button component.", - "isPublicDocs": true, + "description": "The button custom element class that renders interactive buttons in the Shopify admin interface. This component triggers actions or navigation when clicked, with customizable visual styles, states, and optional icons.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", - "defaultValue": "false" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier." + "name": "variant", + "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", + "description": "The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.", + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "loading", - "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", - "defaultValue": "false" + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "variant", - "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "defaultValue": "'auto'" + "name": "disabled", + "value": "boolean", + "description": "Whether the button is disabled, preventing any interaction. When `true`, the button appears visually disabled and doesn't respond to user clicks.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" + "name": "loading", + "value": "boolean", + "description": "Whether the button is in a loading state. When `true`, displays a loading indicator and prevents interaction to show that an action is in progress.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to open the linked document when the button acts as a link. Available options: `''`, `'_blank'`, `'_self'`, `'_parent'`, or `'_top'`.", "defaultValue": "'auto'" }, { @@ -98782,21 +110671,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "A URL that the button should navigate to when clicked. When provided, the button behaves as a link." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Prompts the user to save the linked URL as a file with the specified filename. Only works when `href` is provided." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The button's behavior in forms. Available options: `'button'`, `'submit'`, or `'reset'`.", "defaultValue": "'button'" }, { @@ -98804,117 +110693,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", - "defaultValue": "'--auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "A text description of the button's purpose for screen readers. This is essential for accessibility when the button doesn't have visible text." }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." - } - ], - "value": "declare class Button extends Button_base implements ButtonProps {\n accessor disabled: ButtonProps['disabled'];\n accessor icon: ButtonProps['icon'];\n accessor loading: ButtonProps['loading'];\n accessor variant: ButtonProps['variant'];\n accessor tone: ButtonProps['tone'];\n accessor target: ButtonProps['target'];\n accessor href: ButtonProps['href'];\n accessor download: ButtonProps['download'];\n accessor type: ButtonProps['type'];\n accessor accessibilityLabel: ButtonProps['accessibilityLabel'];\n constructor();\n}" - }, - "AnyString": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "AnyString", - "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true - }, - "ButtonGroup": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ButtonGroup", - "description": "Configure the following properties on the button group component.", - "isPublicDocs": true, - "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "gap", - "value": "\"base\" | \"none\"", - "description": "The spacing between buttons in the group.\n\n- `base`: Standard spacing that provides clear visual separation between buttons.\n- `none`: No spacing, creating a connected button group.", - "defaultValue": "'base'" + "name": "inlineSize", + "value": "\"auto\" | \"fill\" | \"fit-content\"", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -98961,7 +110755,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -98969,39 +110763,197 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle'", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", + "defaultValue": "'--auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "commandFor", + "value": "string", + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", + "value": "string", + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class ButtonGroup\n extends PreactCustomElement\n implements ButtonGroupProps\n{\n accessor gap: ButtonGroupProps['gap'];\n accessor accessibilityLabel: ButtonGroupProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Button\n extends ButtonBase\n implements ButtonProps\n{\n /**\n * The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: ButtonProps['icon'];\n /**\n * The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.\n */\n variant: ButtonProps['variant'];\n /**\n * The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.\n */\n tone: ButtonProps['tone'];\n constructor();\n}" + }, + "AnyString": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "AnyString", + "value": "string & {}", + "description": "Prevents widening string literal types in a union to `string`." + }, + "ButtonGroup": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ButtonGroup", + "description": "A button group that arranges multiple buttons together with consistent spacing and semantic grouping for related actions.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "gap", + "value": "\"base\" | \"none\"", + "description": "The amount of spacing between buttons in the group, affecting the visual separation of actions.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that's only visible to screen readers, describing the purpose of this group of buttons." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class ButtonGroup extends ButtonGroupBase implements ButtonGroupProps {\n constructor();\n}" }, "Checkbox": { "filePath": "src/surfaces/admin/components.ts", "name": "Checkbox", - "description": "Configure the following properties on the checkbox component.", - "isPublicDocs": true, + "description": "A checkbox that lets users select or deselect an option, with support for an indeterminate state.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "indeterminate", "value": "boolean", - "description": "Whether the checkbox displays in an indeterminate state (neither checked nor unchecked), typically used to indicate partial selection in hierarchical lists.\n\nThis visual state takes priority over the `checked` prop in appearance only. The form submission value is still determined by the `checked` prop.\n\nIf `indeterminate` has not been explicitly set and hasn't been modified by user interaction, it returns the value of `defaultIndeterminate`." + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultIndeterminate", "value": "boolean", - "description": "The initial indeterminate state for uncontrolled components. Use this when you want the checkbox to start in an indeterminate state but don't need to control it afterward.\n\nThis value applies until `indeterminate` is explicitly set or the user changes the checkbox state by clicking.", + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "labelAccessibilityVisibility", + "value": "\"visible\" | \"exclusive\"", + "description": "", + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -99016,7 +110968,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -99024,28 +110976,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -99068,7 +111020,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -99076,23 +111028,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -99138,7 +111097,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -99146,24 +111105,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Checkbox extends PreactCheckboxElement implements CheckboxProps {\n get indeterminate(): CheckboxProps['indeterminate'];\n set indeterminate(indeterminate: CheckboxProps['indeterminate']);\n accessor defaultIndeterminate: CheckboxProps['defaultIndeterminate'];\n constructor();\n}" + "value": "declare class Checkbox extends CheckboxBase implements CheckboxProps {\n constructor();\n}" + }, + "CallbackEvent": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CallbackEvent", + "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." }, "Chip": { "filePath": "src/surfaces/admin/components.ts", "name": "Chip", - "description": "Configure the following properties on the chip component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "Modify the color to be more or less intense.", "defaultValue": "'base'" }, { @@ -99171,7 +111151,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -99218,7 +111213,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -99226,24 +111221,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Chip extends PreactCustomElement implements ChipProps {\n accessor color: ChipProps['color'];\n accessor accessibilityLabel: ChipProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Chip extends PolarisCustomElement implements ChipProps {\n color: ChipProps['color'];\n accessibilityLabel: ChipProps['accessibilityLabel'];\n removable: ChipProps['removable'];\n constructor(renderImpl?: Omit);\n}" }, "Choice": { "filePath": "src/surfaces/admin/components.ts", "name": "Choice", - "description": "The choice component creates individual selectable options within a choice list. Use choice to define each option that merchants can select, supporting both single selection (radio buttons) and multiple selection (checkboxes) modes.\n\nChoice components support labels, help text, and custom content through slots, providing flexible option presentation within choice lists.", - "isPublicDocs": true, + "description": "A single choice within a choice list that can be selected with a radio button or checkbox.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the choice is disabled and can't be selected.", "defaultValue": "false" }, { @@ -99251,7 +111260,7 @@ "syntaxKind": "GetAccessor", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the choice is currently selected.", "defaultValue": "false" }, { @@ -99259,21 +111268,21 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this choice is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, used when the visual label isn't descriptive enough." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the choice should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -99292,6 +111301,13 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -99321,7 +111337,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -99329,24 +111345,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Choice extends PreactCustomElement implements ChoiceProps {\n accessor disabled: ChoiceProps['disabled'];\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n accessor value: ChoiceProps['value'];\n accessor accessibilityLabel: ChoiceProps['accessibilityLabel'];\n accessor defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Choice extends PolarisCustomElement implements ChoiceProps {\n /**\n * Whether the choice is disabled and can't be selected.\n */\n disabled: ChoiceProps['disabled'];\n /**\n * Whether the choice is currently selected.\n */\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n /**\n * The value that's submitted with the form when this choice is selected.\n */\n value: ChoiceProps['value'];\n /**\n * A label that's only visible to screen readers, used when the visual label isn't descriptive enough.\n */\n accessibilityLabel: ChoiceProps['accessibilityLabel'];\n /**\n * Whether the choice should be selected when it's first rendered.\n */\n defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ChoiceList": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceList", - "description": "Configure the following properties on the choice list component.", - "isPublicDocs": true, + "description": "A list of choices that lets users select one or more options using radio buttons or checkboxes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "addEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", + "description": "Wraps change and input event listeners so they only fire when the event was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n\nThis prevents form events from elements inside secondary content (e.g. TextField, native ) from being mistakenly treated as ChoiceList value-change events, while still allowing those events to bubble normally through the DOM (preserving React's event delegation).", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "removeEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction. When `true`, the `disabled` property on any child choices is ignored.", + "description": "Whether all choices in the list are disabled and can't be selected.", "defaultValue": "false" }, { @@ -99354,43 +111400,43 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name that identifies this choice list when the form is submitted." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the choice list when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the choice list." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "multiple", "value": "boolean", - "description": "Whether multiple choices can be selected.", + "description": "Whether users can select more than one choice at a time.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the choice list is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -99398,7 +111444,7 @@ "syntaxKind": "GetAccessor", "name": "values", "value": "string[]", - "description": "An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected." + "description": "The values of the currently selected choices." }, { "filePath": "src/surfaces/admin/components.ts", @@ -99427,11 +111473,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$3@11434", + "name": "__@internals$3@16769", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -99461,7 +111514,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -99469,38 +111522,52 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ChoiceList extends BaseClass$3 implements ChoiceListProps {\n accessor disabled: ChoiceListProps['disabled'];\n accessor name: ChoiceListProps['name'];\n accessor error: ChoiceListProps['error'];\n accessor details: ChoiceListProps['details'];\n accessor multiple: ChoiceListProps['multiple'];\n accessor label: ChoiceListProps['label'];\n accessor labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class ChoiceList extends BaseClass$1 implements ChoiceListProps {\n /**\n * Wraps change and input event listeners so they only fire when the event\n * was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n *\n * This prevents form events from elements inside secondary content (e.g.\n * TextField, native ) from being mistakenly treated as ChoiceList\n * value-change events, while still allowing those events to bubble normally\n * through the DOM (preserving React's event delegation).\n * @private\n */\n addEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n\n /** @private */\n removeEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: EventListenerOptions | boolean,\n ): void;\n\n /**\n * Whether all choices in the list are disabled and can't be selected.\n */\n disabled: ChoiceListProps['disabled'];\n /**\n * The name that identifies this choice list when the form is submitted.\n */\n name: ChoiceListProps['name'];\n /**\n * An error message that's displayed below the choice list when validation fails.\n */\n error: ChoiceListProps['error'];\n /**\n * Additional text to provide context or guidance for the choice list.\n */\n details: ChoiceListProps['details'];\n /**\n * Whether users can select more than one choice at a time.\n */\n multiple: ChoiceListProps['multiple'];\n /**\n * The text that describes what the choice list is for.\n */\n label: ChoiceListProps['label'];\n /**\n * Controls whether the label is visible to all users or only to screen readers.\n */\n labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n /**\n * The values of the currently selected choices.\n */\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "Clickable": { "filePath": "src/surfaces/admin/components.ts", "name": "Clickable", - "description": "Configure the following properties on the clickable component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the component is disabled, preventing clicks and focus. When disabled, the `click` event won't fire and click events from child elements stop propagating immediately. Interactive child elements can still receive focus and be interacted with. This doesn't apply visual styling by default. You shouldapply disabled styling as needed." + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the component is in a loading state, which indicates to assistive technology that an action is in progress and prevents interaction." + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -99508,21 +111575,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "defaultValue": "'button'" }, { @@ -99530,7 +111597,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -99538,7 +111605,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -99546,7 +111613,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -99554,7 +111621,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -99562,7 +111629,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -99570,7 +111637,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -99578,7 +111645,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -99586,7 +111653,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -99594,7 +111661,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -99602,7 +111669,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -99610,7 +111677,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -99618,7 +111685,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -99626,7 +111693,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -99634,7 +111701,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -99642,7 +111709,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -99650,7 +111717,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -99658,7 +111725,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -99678,7 +111745,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -99686,7 +111753,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -99694,7 +111761,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -99702,7 +111769,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -99710,14 +111777,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -99725,9 +111792,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -99773,7 +111847,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -99781,15 +111855,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -99797,30 +111886,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n accessor disabled: ClickableProps['disabled'];\n accessor loading: ClickableProps['loading'];\n accessor target: ClickableProps['target'];\n accessor href: ClickableProps['href'];\n accessor download: ClickableProps['download'];\n accessor type: ClickableProps['type'];\n constructor();\n}" + "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n disabled: ClickableProps['disabled'];\n loading: ClickableProps['loading'];\n target: ClickableProps['target'];\n href: ClickableProps['href'];\n download: ClickableProps['download'];\n type: ClickableProps['type'];\n constructor();\n}" }, "ClickableChip": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChip", - "description": "Configure the following properties on the clickable chip component.", - "isPublicDocs": true, + "description": "A custom element for displaying interactive chips that can be clicked or removed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "The color of the chip.", "defaultValue": "'base'" }, { @@ -99828,14 +111916,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the chip for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "removable", "value": "boolean", - "description": "Whether the chip displays a remove button for dismissal. When clicked, the `remove` callback fires.", + "description": "Whether the chip can be removed by the user.", "defaultValue": "false" }, { @@ -99843,7 +111931,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Whether the chip is hidden from view. When using controlled component pattern with `removable` chips, update this property when the `remove` event fires. For non-removable chips, manually toggle this property to show or hide the chip.", + "description": "Whether the chip is hidden from view.", "defaultValue": "false" }, { @@ -99851,7 +111939,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the chip is disabled, preventing any user interaction.", + "description": "Whether the chip is disabled and can't be clicked.", "defaultValue": "false" }, { @@ -99859,7 +111947,14 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to navigate to when the chip is clicked." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -99906,7 +112001,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -99914,15 +112009,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -99930,30 +112040,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class ClickableChip\n extends ClickableChip_base\n implements ClickableChipProps\n{\n accessor color: ClickableChipProps['color'];\n accessor accessibilityLabel: ClickableChipProps['accessibilityLabel'];\n accessor removable: ClickableChipProps['removable'];\n accessor hidden: ClickableChipProps['hidden'];\n accessor disabled: ClickableChipProps['disabled'];\n accessor href: ClickableChipProps['href'];\n constructor();\n}" + "value": "declare class ClickableChip\n extends ClickableChipBase\n implements ClickableChipProps\n{\n /**\n * The color of the chip.\n */\n color: ClickableChipProps['color'];\n constructor();\n}" }, "ColorField": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorField", - "description": "Configure the following properties on the color field component.", - "isPublicDocs": true, + "description": "The color field custom element class that renders a color input field with integrated visual picker in the Shopify admin interface. This component allows merchants to select colors by typing hex values or using an interactive color picker, with optional support for transparency (alpha channel).", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -99961,7 +112070,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", @@ -99984,7 +112093,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\"", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -99992,35 +112101,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -100028,14 +112137,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -100043,7 +112152,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -100067,7 +112176,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -100083,7 +112192,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -100091,23 +112200,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -100145,7 +112261,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -100153,24 +112269,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ColorField\n extends PreactFieldElement\n implements ColorFieldProps\n{\n accessor alpha: ColorFieldProps['alpha'];\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n setInternalValue(value: string, normalize: boolean): void;\n}" + "value": "declare class ColorField extends ColorFieldBase implements ColorFieldProps {\n constructor();\n}" }, "ColorPicker": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorPicker", - "description": "Configure the following properties on the color picker component.", - "isPublicDocs": true, + "description": "A visual color picker component that allows users to select colors from a color spectrum interface.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -100178,154 +112308,138 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial color value when the field first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts interacting, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", "name": "formResetCallback", "value": "() => void", - "description": "A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@internals$2@11535", - "value": "ElementInternals", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", "description": "", "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true } ], - "value": "declare class ColorPicker extends BaseClass$2 implements ColorPickerProps {\n accessor alpha: boolean;\n accessor name: string;\n accessor defaultValue: string;\n get value(): string;\n set value(value: string);\n /**\n * A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`.\n */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class ColorPicker extends BaseClass implements ColorPickerProps {\n /**\n * Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.\n *\n * @default false\n */\n alpha: boolean;\n /**\n * The name of the picker, used when submitting form data.\n */\n name: string;\n /**\n * The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n defaultValue: string;\n /**\n * The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n}" }, "DateField": { "filePath": "src/surfaces/admin/components.ts", "name": "DateField", - "description": "Configure the following properties on the date field component.", - "isPublicDocs": true, + "description": "The date field custom element class that renders a date input field with integrated calendar picker in the Shopify admin interface. This component allows merchants to select dates by typing or using a visual calendar, with support for date range restrictions and day-of-week constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar picker, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar picker first opens, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "DateAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -100333,36 +112447,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "defaultValue": "\"\"" + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -100370,14 +112483,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -100385,7 +112498,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -100409,7 +112522,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -100433,7 +112546,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -100441,31 +112554,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected date in `YYYY-MM-DD` format. An empty string means no date is selected.", - "defaultValue": "\"\"" + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -100503,7 +112622,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -100511,78 +112630,139 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DateField\n extends PreactFieldElement\n implements DateFieldProps\n{\n accessor allow: DateFieldProps['allow'];\n accessor disallow: DateFieldProps['disallow'];\n accessor allowDays: DateFieldProps['allowDays'];\n accessor disallowDays: DateFieldProps['disallowDays'];\n set view(view: string);\n get view(): string;\n accessor defaultView: DateFieldProps['defaultView'];\n constructor();\n}" + "value": "declare class DateField extends DateFieldBase implements DateFieldProps {\n constructor();\n}" }, "DateAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "DateAutocompleteField", "value": "'bday-day' | 'bday-month' | 'bday-year' | 'bday' | 'cc-expiry-month' | 'cc-expiry-year' | 'cc-expiry'", - "description": "Represents autocomplete values that are valid for date input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for date-based inputs.\n\nAvailable values:\n- `bday` - Complete birthday date\n- `bday-day` - Day component of a birthday (1-31)\n- `bday-month` - Month component of a birthday (1-12)\n- `bday-year` - Year component of a birthday (1990)\n- `cc-expiry` - Complete credit card expiration date\n- `cc-expiry-month` - Month component of a credit card expiration date (1-12)\n- `cc-expiry-year` - Year component of a credit card expiration date (2025)", - "isPublicDocs": true + "description": "" }, "DatePicker": { "filePath": "src/surfaces/admin/components.ts", "name": "DatePicker", - "description": "Configure the following properties on the date picker component.", - "isPublicDocs": true, + "description": "The date picker custom element class that renders a standalone calendar interface in the Shopify admin. This component allows merchants to select single dates or date ranges using an interactive calendar with month/year navigation, date constraints, and day-of-week restrictions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar first renders, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"single\" | \"range\"", - "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "description": "The type of date selection allowed. Available values: `single`, `range`.", "defaultValue": "\"single\"" }, { @@ -100590,7 +112770,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initially selected date(s) when the component first renders. An empty string means no date is initially selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The initial selected date or date range when the picker first renders, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -100598,14 +112778,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "value", "value": "string", - "description": "The currently selected date(s). An empty string means no date is selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The currently selected date or date range, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -100619,19 +112799,26 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@dirtyStateSymbol@11579", - "value": "boolean", + "name": "__@internals$1@16931", + "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$1@11578", - "value": "ElementInternals", + "name": "__@dirtyStateSymbol@16932", + "value": "boolean", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -100677,7 +112864,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -100685,17 +112872,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DatePicker extends BaseClass$1 implements DatePickerProps {\n accessor defaultView: string;\n set view(view: string);\n get view(): string;\n accessor allow: DatePickerProps['allow'];\n accessor disallow: DatePickerProps['disallow'];\n accessor allowDays: DatePickerProps['allowDays'];\n accessor disallowDays: DatePickerProps['disallowDays'];\n accessor type: DatePickerProps['type'];\n accessor defaultValue: DatePickerProps['defaultValue'];\n accessor name: DatePickerProps['name'];\n set value(value: string);\n get value(): string;\n /** @private */\n [dirtyStateSymbol]: boolean;\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DatePicker\n extends DatePickerBase\n implements DatePickerProps\n{\n constructor();\n}" }, "DropZone": { "filePath": "src/surfaces/admin/components.ts", "name": "DropZone", - "description": "Configure the following properties on the drop zone component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -100717,29 +112918,29 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -100755,14 +112956,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -100792,7 +112993,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@setFiles@11614", + "name": "__@setFiles@16968", "value": "(files: File[]) => void", "description": "", "isPrivate": true @@ -100800,7 +113001,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@getFileInput@11616", + "name": "__@getFileInput@16970", "value": "() => HTMLInputElement", "description": "", "isPrivate": true @@ -100808,11 +113009,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals@11615", + "name": "__@internals@16969", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -100858,7 +113066,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -100866,17 +113074,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DropZone extends BaseClass implements DropZoneProps {\n accessor accept: DropZoneProps['accept'];\n accessor accessibilityLabel: DropZoneProps['accessibilityLabel'];\n accessor disabled: DropZoneProps['disabled'];\n accessor error: DropZoneProps['error'];\n accessor label: DropZoneProps['label'];\n accessor labelAccessibilityVisibility: DropZoneProps['labelAccessibilityVisibility'];\n accessor multiple: DropZoneProps['multiple'];\n accessor name: DropZoneProps['name'];\n accessor required: DropZoneProps['required'];\n get value(): string;\n /** This sets the input value for a file type, which cannot be set programatically, so it can only be reset. */\n set value(value: '' | null);\n get files(): File[];\n set files(files: File[]);\n /** @private */\n [setFiles](files: File[]): void;\n /** @private */\n [getFileInput](): ReplaceType<\n Element | null | undefined,\n Element,\n HTMLInputElement\n >;\n\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DropZone extends DropZoneBase implements DropZoneProps {\n constructor();\n}" }, "Divider": { "filePath": "src/surfaces/admin/components.ts", "name": "Divider", - "description": "Configure the following properties on the divider component.", - "isPublicDocs": true, + "description": "A divider is a visual separator that creates a line between different sections of content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -100894,6 +113116,13 @@ "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -100939,7 +113168,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -100947,32 +113176,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Divider extends PreactCustomElement implements DividerProps {\n accessor direction: DividerProps['direction'];\n accessor color: DividerProps['color'];\n constructor();\n}" + "value": "declare class Divider extends PolarisCustomElement implements DividerProps {\n /**\n * The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n *\n * - `inline`: Horizontal divider for separating vertically stacked content\n * - `block`: Vertical divider for separating horizontally arranged content\n *\n * @default 'inline'\n */\n direction: DividerProps['direction'];\n /**\n * The visual prominence of the divider line.\n *\n * - `base`: Standard divider for most separations (default)\n * - `strong`: More prominent divider for major section breaks\n *\n * @default 'base'\n */\n color: DividerProps['color'];\n constructor();\n}" }, "EmailField": { "filePath": "src/surfaces/admin/components.ts", "name": "EmailField", - "description": "Configure the following properties on the email field component.", - "isPublicDocs": true, + "description": "The email field custom element class that renders an email input field in the Shopify admin interface. This component allows merchants to enter email addresses with automatic validation and optimized mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | EmailAutocompleteField | `section-${string} email` | `section-${string} home email` | `section-${string} mobile email` | `section-${string} fax email` | `section-${string} pager email` | \"shipping email\" | \"shipping home email\" | \"shipping mobile email\" | \"shipping fax email\" | \"shipping pager email\" | \"billing email\" | \"billing home email\" | \"billing mobile email\" | \"billing fax email\" | \"billing pager email\" | `section-${string} shipping email` | `section-${string} shipping home email` | `section-${string} shipping mobile email` | `section-${string} shipping fax email` | `section-${string} shipping pager email` | `section-${string} billing email` | `section-${string} billing home email` | `section-${string} billing mobile email` | `section-${string} billing fax email` | `section-${string} billing pager email`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint as to the intended content of the field for autocomplete purposes.", + "defaultValue": "'email'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -100980,50 +113223,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -101031,14 +113267,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -101046,7 +113282,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -101070,7 +113306,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -101094,7 +113330,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -101102,23 +113338,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -101156,7 +113406,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -101164,32 +113414,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class EmailField\n extends PreactFieldElement\n implements EmailFieldProps\n{\n accessor autocomplete: EmailFieldProps['autocomplete'];\n accessor maxLength: EmailFieldProps['maxLength'];\n accessor minLength: EmailFieldProps['minLength'];\n /**\n * The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class EmailField extends EmailFieldBase implements EmailFieldProps {\n constructor();\n}" }, "EmailAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "EmailAutocompleteField", "value": "'email' | 'home email' | 'mobile email' | 'fax email' | 'pager email'", - "description": "Represents autocomplete values that are valid for email input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for email inputs.\n\nAvailable values:\n- `email` - Primary email address\n- `home email` - Home email address\n- `mobile email` - Mobile device email address\n- `fax email` - Fax machine email address\n- `pager email` - Pager device email address", - "isPublicDocs": true + "description": "" }, "Grid": { "filePath": "src/surfaces/admin/components.ts", "name": "Grid", - "description": "Configure the following properties on the grid component.", - "isPublicDocs": true, + "description": "A grid is a layout component that arranges its children in rows and columns with precise control over sizing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridTemplateColumns", "value": "string", - "description": "The columns in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid columns.", "defaultValue": "'none'" }, { @@ -101197,7 +113460,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridTemplateRows", "value": "string", - "description": "The rows in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid rows.", "defaultValue": "'none'" }, { @@ -101205,7 +113468,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyItems", "value": "\"\" | JustifyItemsKeyword", - "description": "Aligns the grid items along the inline axis.", + "description": "The alignment of grid items along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -101213,7 +113476,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "\"\" | AlignItemsKeyword", - "description": "Aligns the grid items along the block axis.", + "description": "The alignment of grid items along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -101221,7 +113484,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeItems", "value": "AlignItemsKeyword | \"normal normal\" | \"normal stretch\" | \"normal baseline\" | \"normal first baseline\" | \"normal last baseline\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch baseline\" | \"stretch first baseline\" | \"stretch last baseline\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline baseline\" | \"baseline first baseline\" | \"baseline last baseline\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline baseline\" | \"first baseline first baseline\" | \"first baseline last baseline\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline baseline\" | \"last baseline first baseline\" | \"last baseline last baseline\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start baseline\" | \"start first baseline\" | \"start last baseline\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end baseline\" | \"end first baseline\" | \"end last baseline\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center baseline\" | \"center first baseline\" | \"center last baseline\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start baseline\" | \"unsafe start first baseline\" | \"unsafe start last baseline\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end baseline\" | \"unsafe end first baseline\" | \"unsafe end last baseline\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center baseline\" | \"unsafe center first baseline\" | \"unsafe center last baseline\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start baseline\" | \"safe start first baseline\" | \"safe start last baseline\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end baseline\" | \"safe end first baseline\" | \"safe end last baseline\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center baseline\" | \"safe center first baseline\" | \"safe center last baseline\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\"", - "description": "A shorthand property for `justify-items` and `align-items`.", + "description": "A shorthand for setting both `alignItems` and `justifyItems`.", "defaultValue": "'normal normal'" }, { @@ -101229,7 +113492,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "\"\" | JustifyContentKeyword", - "description": "Aligns the grid along the inline axis. This overrides the inline value of `placeContent`.", + "description": "The alignment of the grid along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -101237,7 +113500,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "\"\" | AlignContentKeyword", - "description": "Aligns the grid along the block axis. This overrides the block value of `placeContent`.", + "description": "The alignment of the grid along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -101245,7 +113508,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeContent", "value": "\"normal normal\" | \"normal stretch\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\" | AlignContentKeyword | \"normal space-between\" | \"normal space-around\" | \"normal space-evenly\" | \"baseline space-between\" | \"baseline space-around\" | \"baseline space-evenly\" | \"first baseline space-between\" | \"first baseline space-around\" | \"first baseline space-evenly\" | \"last baseline space-between\" | \"last baseline space-around\" | \"last baseline space-evenly\" | \"start space-between\" | \"start space-around\" | \"start space-evenly\" | \"end space-between\" | \"end space-around\" | \"end space-evenly\" | \"center space-between\" | \"center space-around\" | \"center space-evenly\" | \"unsafe start space-between\" | \"unsafe start space-around\" | \"unsafe start space-evenly\" | \"unsafe end space-between\" | \"unsafe end space-around\" | \"unsafe end space-evenly\" | \"unsafe center space-between\" | \"unsafe center space-around\" | \"unsafe center space-evenly\" | \"safe start space-between\" | \"safe start space-around\" | \"safe start space-evenly\" | \"safe end space-between\" | \"safe end space-around\" | \"safe end space-evenly\" | \"safe center space-between\" | \"safe center space-around\" | \"safe center space-evenly\" | \"stretch space-between\" | \"stretch space-around\" | \"stretch space-evenly\" | \"space-between normal\" | \"space-between start\" | \"space-between end\" | \"space-between center\" | \"space-between unsafe start\" | \"space-between unsafe end\" | \"space-between unsafe center\" | \"space-between safe start\" | \"space-between safe end\" | \"space-between safe center\" | \"space-between stretch\" | \"space-between space-between\" | \"space-between space-around\" | \"space-between space-evenly\" | \"space-around normal\" | \"space-around start\" | \"space-around end\" | \"space-around center\" | \"space-around unsafe start\" | \"space-around unsafe end\" | \"space-around unsafe center\" | \"space-around safe start\" | \"space-around safe end\" | \"space-around safe center\" | \"space-around stretch\" | \"space-around space-between\" | \"space-around space-around\" | \"space-around space-evenly\" | \"space-evenly normal\" | \"space-evenly start\" | \"space-evenly end\" | \"space-evenly center\" | \"space-evenly unsafe start\" | \"space-evenly unsafe end\" | \"space-evenly unsafe center\" | \"space-evenly safe start\" | \"space-evenly safe end\" | \"space-evenly safe center\" | \"space-evenly stretch\" | \"space-evenly space-between\" | \"space-evenly space-around\" | \"space-evenly space-evenly\"", - "description": "A shorthand property for `justify-content` and `align-content`.", + "description": "A shorthand for setting both `alignContent` and `justifyContent`.", "defaultValue": "'normal normal'" }, { @@ -101253,7 +113516,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows and columns.", "defaultValue": "'none'" }, { @@ -101261,7 +113524,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "s spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows.", "defaultValue": "'' - meaning no override" }, { @@ -101269,7 +113532,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid columns.", "defaultValue": "'' - meaning no override" }, { @@ -101277,7 +113540,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -101285,7 +113548,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -101293,7 +113556,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -101301,7 +113564,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -101309,7 +113572,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -101317,7 +113580,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -101325,7 +113588,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -101333,7 +113596,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -101341,7 +113604,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -101349,7 +113612,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -101357,7 +113620,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -101365,7 +113628,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -101373,7 +113636,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -101381,7 +113644,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -101389,7 +113652,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -101397,7 +113660,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -101405,7 +113668,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -101425,7 +113688,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -101433,7 +113696,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -101441,7 +113704,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -101449,7 +113712,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -101457,14 +113720,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -101472,9 +113735,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -101520,7 +113790,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -101528,96 +113798,101 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n accessor gridTemplateColumns: GridProps['gridTemplateColumns'];\n accessor gridTemplateRows: GridProps['gridTemplateRows'];\n accessor justifyItems: GridProps['justifyItems'];\n accessor alignItems: GridProps['alignItems'];\n accessor placeItems: GridProps['placeItems'];\n accessor justifyContent: GridProps['justifyContent'];\n accessor alignContent: GridProps['alignContent'];\n accessor placeContent: GridProps['placeContent'];\n accessor gap: GridProps['gap'];\n accessor rowGap: GridProps['rowGap'];\n accessor columnGap: GridProps['columnGap'];\n}" + "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n /**\n * The template that defines the grid columns.\n */\n gridTemplateColumns: GridProps['gridTemplateColumns'];\n /**\n * The template that defines the grid rows.\n */\n gridTemplateRows: GridProps['gridTemplateRows'];\n /**\n * The alignment of grid items along the inline axis.\n */\n justifyItems: GridProps['justifyItems'];\n /**\n * The alignment of grid items along the block axis.\n */\n alignItems: GridProps['alignItems'];\n /**\n * A shorthand for setting both `alignItems` and `justifyItems`.\n */\n placeItems: GridProps['placeItems'];\n /**\n * The alignment of the grid along the inline axis.\n */\n justifyContent: GridProps['justifyContent'];\n /**\n * The alignment of the grid along the block axis.\n */\n alignContent: GridProps['alignContent'];\n /**\n * A shorthand for setting both `alignContent` and `justifyContent`.\n */\n placeContent: GridProps['placeContent'];\n /**\n * The spacing between grid rows and columns.\n */\n gap: GridProps['gap'];\n /**\n * The spacing between grid rows.\n */\n rowGap: GridProps['rowGap'];\n /**\n * The spacing between grid columns.\n */\n columnGap: GridProps['columnGap'];\n}" }, "JustifyItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.\n\nLearn more about the [justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).", - "isPublicDocs": true + "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis." }, "BaselinePosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BaselinePosition", "value": "'baseline' | 'first baseline' | 'last baseline'", - "description": "Represents baseline alignment positions used to align items relative to their baselines.\n- `baseline`: Aligns to the baseline of the parent.\n- `first baseline`: Aligns to the first baseline of the parent.\n- `last baseline`: Aligns to the last baseline of the parent.", - "isPublicDocs": true + "description": "" }, "OverflowPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "OverflowPosition", "value": "`unsafe ${ContentPosition}` | `safe ${ContentPosition}`", - "description": "Represents content positioning with overflow behavior control. Use `safe` to prevent content from becoming inaccessible when it overflows, or `unsafe` to allow overflow regardless of accessibility.", - "isPublicDocs": true + "description": "" }, "ContentPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentPosition", "value": "'center' | 'start' | 'end'", - "description": "Defines the position of content along an axis.\n- `center`: Centers the content.\n- `start`: Aligns content to the start.\n- `end`: Aligns content to the end.", - "isPublicDocs": true + "description": "" }, "AlignItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Align items sets the align-self value on all direct children as a group.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isPublicDocs": true + "description": "Align items sets the align-self value on all direct children as a group." }, "JustifyContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyContentKeyword", "value": "'normal' | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", - "isPublicDocs": true + "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container." }, "ContentDistribution": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentDistribution", "value": "'space-between' | 'space-around' | 'space-evenly' | 'stretch'", - "description": "Defines how space is distributed between and around content items in flex and grid layouts.\n- `space-between`: Distributes items evenly with the first item at the start and last at the end.\n- `space-around`: Distributes items evenly with equal space around each item.\n- `space-evenly`: Distributes items evenly with equal space between them.\n- `stretch`: Stretches items to fill the container.", - "isPublicDocs": true + "description": "" }, "AlignContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignContentKeyword", "value": "'normal' | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isPublicDocs": true + "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis." }, "SpacingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SpacingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the spacing size between elements, using the standard size scale or `none` for no spacing.", - "isPublicDocs": true + "description": "" }, "GridItem": { "filePath": "src/surfaces/admin/components.ts", "name": "GridItem", - "description": "The grid item component represents a single cell within a grid layout, allowing you to control how content is positioned and sized within the grid. Use grid item as a child of grid to specify column span, row span, and positioning for individual content areas.\n\nGrid item supports precise placement control through column and row properties, enabling you to create complex layouts where different items occupy varying amounts of space or appear in specific grid positions.", - "isPublicDocs": true, + "description": "A grid item is a child of a grid that can be positioned within specific rows and columns.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridColumn", "value": "\"auto\" | `span ${number}`", - "description": "The number of columns the item will span across.\n\nLearn more about the [grid-column property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).", + "description": "The column position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -101625,7 +113900,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridRow", "value": "\"auto\" | `span ${number}`", - "description": "The number of rows the item will span across.\n\nLearn more about the [grid-row property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).", + "description": "The row position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -101633,7 +113908,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -101641,7 +113916,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -101649,7 +113924,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -101657,7 +113932,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -101665,7 +113940,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -101673,7 +113948,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -101681,7 +113956,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -101689,7 +113964,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -101697,7 +113972,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -101705,7 +113980,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -101713,7 +113988,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -101721,7 +113996,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -101729,7 +114004,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -101737,7 +114012,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -101745,7 +114020,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -101753,7 +114028,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -101761,7 +114036,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -101781,7 +114056,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -101789,7 +114064,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -101797,7 +114072,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -101805,7 +114080,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -101813,14 +114088,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -101828,9 +114103,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -101876,7 +114158,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -101884,24 +114166,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class GridItem extends BoxElement implements GridItemProps {\n accessor gridColumn: GridItemProps['gridColumn'];\n accessor gridRow: GridItemProps['gridRow'];\n constructor();\n}" + "value": "declare class GridItem extends BoxElement implements GridItemProps {\n /**\n * The column position and span of the grid item.\n */\n gridColumn: GridItemProps['gridColumn'];\n /**\n * The row position and span of the grid item.\n */\n gridRow: GridItemProps['gridRow'];\n constructor();\n}" }, "Heading": { "filePath": "src/surfaces/admin/components.ts", "name": "Heading", - "description": "Configure the following properties on the heading component.", - "isPublicDocs": true, + "description": "A custom element for displaying hierarchical section titles and headings with appropriate semantic meaning and visual styling. Use Heading to structure your content with proper heading levels for both visual hierarchy and accessibility.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"heading\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The ARIA role for the heading. Set to `'heading'` (the default) for standard heading semantics, or `'presentation'` / `'none'` to remove heading semantics for decorative use.", "defaultValue": "'heading'" }, { @@ -101909,7 +114205,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lineClamp", "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", "defaultValue": "Infinity - no truncation is applied" }, { @@ -101917,9 +114213,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -101965,7 +114268,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -101973,47 +114276,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Heading extends PreactCustomElement implements HeadingProps {\n accessor accessibilityRole: HeadingProps['accessibilityRole'];\n accessor lineClamp: HeadingProps['lineClamp'];\n accessor accessibilityVisibility: HeadingProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Heading extends HeadingBase implements HeadingProps {\n constructor();\n}" }, "Icon": { "filePath": "src/surfaces/admin/components.ts", "name": "Icon", - "description": "Configure the following properties on the icon component.", - "isPublicDocs": true, + "description": "An icon displays a graphical symbol from the icon library.", "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", + "description": "The color tone of the icon based on its semantic meaning.", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "The icon to display from the icon library.\n\nSet to a valid icon name to display that icon. To hide the icon completely, use an empty string `''`. To reserve the icon's space without displaying an icon, use `'empty'`." + "value": "\"\" | IconType", + "description": "The type of icon to display." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color emphasis of the icon.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"base\"", - "description": "The size of the icon.\n\n- `small`: Smaller icon suitable for inline use within text or compact UI elements.\n- `base`: Default size that works well for standalone icons and standard use cases.", + "description": "The size of the icon.", "defaultValue": "'base'" }, { @@ -102021,7 +114338,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The element that this icon should show interest for when activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -102068,7 +114392,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -102076,53 +114400,67 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Icon extends PreactCustomElement implements IconProps {\n accessor color: IconProps['color'];\n accessor tone: IconProps['tone'];\n accessor type: IconProps['type'];\n accessor size: IconProps['size'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Icon extends IconBase implements IconProps {\n /**\n * The color tone of the icon based on its semantic meaning.\n */\n tone: IconProps['tone'];\n /**\n * The type of icon to display.\n */\n type: IconProps['type'];\n constructor();\n}" }, "Image": { "filePath": "src/surfaces/admin/components.ts", "name": "Image", - "description": "Configure the following properties on the image component.", - "isPublicDocs": true, + "description": "An image displays pictures with configurable sizing, loading behavior, and borders.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "srcSet", "value": "string", - "description": "A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n\nLearn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset)." + "description": "A set of source images with different sizes for responsive loading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "sizes", "value": "string", - "description": "A set of media conditions and their corresponding sizes.\n\nLearn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes)." + "description": "The sizes of the image at different viewport widths." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "aspectRatio", "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", - "description": "The aspect ratio of the image.\n\nThe rendering of the image will depend on the `inlineSize` value:\n\n- `inlineSize=\"fill\"`: the aspect ratio will be respected and the image will take the necessary space.\n- `inlineSize=\"auto\"`: the image will not render until it has loaded and the aspect ratio will be ignored.\n\nFor example, if the value is set as `50 / 100`, the getter returns `50 / 100`. If the value is set as `0.5`, the getter returns `0.5 / 1`.\n\nLearn more about the [aspect-ratio property](https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio).", + "description": "The aspect ratio of the image as a width-to-height ratio.", "defaultValue": "'1/1'" }, { @@ -102130,7 +114468,7 @@ "syntaxKind": "PropertyDeclaration", "name": "objectFit", "value": "\"contain\" | \"cover\"", - "description": "The image resizing behavior to fit within its container.\n\n- `contain`: Scales the image to fit within the container while maintaining its aspect ratio. The entire image is visible, but might leave empty space.\n- `cover`: Scales the image to fill the entire container while maintaining its aspect ratio. The image might be cropped to fit.\n\nThe image is always positioned in the center of the container.\n\nLearn more about the [object-fit property](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).", + "description": "How the image should be resized to fit its container.", "defaultValue": "'contain'" }, { @@ -102138,7 +114476,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "\"eager\" | \"lazy\"", - "description": "The loading strategy for the image.\n\n- `eager`: Immediately loads the image, irrespective of its position within the visible viewport.\n- `lazy`: Delays loading the image until it approaches a specified distance from the viewport.\n\nLearn more about the [loading attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading).", + "description": "When the image should be loaded.", "defaultValue": "'eager'" }, { @@ -102146,7 +114484,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"img\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The accessibility role for the image.", "defaultValue": "'img'" }, { @@ -102154,7 +114492,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "\"auto\" | \"fill\"", - "description": "The displayed inline width of the image.\n\n- `fill`: the image will takes up 100% of the available inline size.\n- `auto`: the image will be displayed at its natural size.\n\nLearn more about the [width attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#width).", + "description": "The inline size (width in horizontal writing modes) of the image.", "defaultValue": "'fill'" }, { @@ -102162,35 +114500,23 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied around the image using shorthand syntax to specify width, color, and style in a single property.", - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "description": "Whether to show a border around the image.", + "defaultValue": "'none' - equivalent to `none base auto`." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderWidth", - "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderStyle", - "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image.", "defaultValue": "'' - meaning no override" }, { @@ -102198,17 +114524,161 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "The color of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the image's corners using the design system's radius scale.", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image.", "defaultValue": "'none'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Image extends PolarisCustomElement implements ImageProps {\n /**\n * The URL of the image to display.\n */\n src: ImageProps['src'];\n /**\n * A set of source images with different sizes for responsive loading.\n */\n srcSet: ImageProps['srcSet'];\n /**\n * The sizes of the image at different viewport widths.\n */\n sizes: ImageProps['sizes'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ImageProps['alt'];\n /**\n * The aspect ratio of the image as a width-to-height ratio.\n */\n aspectRatio: ImageProps['aspectRatio'];\n /**\n * How the image should be resized to fit its container.\n */\n objectFit: ImageProps['objectFit'];\n /**\n * When the image should be loaded.\n */\n loading: ImageProps['loading'];\n /**\n * The accessibility role for the image.\n */\n accessibilityRole: ImageProps['accessibilityRole'];\n /**\n * The inline size (width in horizontal writing modes) of the image.\n */\n inlineSize: ImageProps['inlineSize'];\n /**\n * Whether to show a border around the image.\n */\n border: ImageProps['border'];\n /**\n * The width of the border around the image.\n */\n borderWidth: ImageProps['borderWidth'];\n /**\n * The style of the border around the image.\n */\n borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image.\n */\n borderColor: ImageProps['borderColor'];\n /**\n * The radius of the border corners around the image.\n */\n borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + }, + "BorderRadiusKeyword": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "BorderRadiusKeyword", + "value": "SizeKeyword | 'max' | 'none'", + "description": "" + }, + "Link": { + "filePath": "src/surfaces/admin/components.ts", + "name": "Link", + "description": "", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "target", + "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", + "description": "Specifies where to display the linked URL.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -102254,7 +114724,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -102262,124 +114732,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Image extends PreactCustomElement implements ImageProps {\n accessor src: ImageProps['src'];\n accessor srcSet: ImageProps['srcSet'];\n accessor sizes: ImageProps['sizes'];\n accessor alt: ImageProps['alt'];\n accessor aspectRatio: ImageProps['aspectRatio'];\n accessor objectFit: ImageProps['objectFit'];\n accessor loading: ImageProps['loading'];\n accessor accessibilityRole: ImageProps['accessibilityRole'];\n accessor inlineSize: ImageProps['inlineSize'];\n /**\n * A border applied around the image using shorthand syntax to specify width, color, and style in a single property.\n */\n accessor border: ImageProps['border'];\n /**\n * The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.\n */\n accessor borderWidth: ImageProps['borderWidth'];\n /**\n * The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.\n */\n accessor borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.\n */\n accessor borderColor: ImageProps['borderColor'];\n /**\n * The roundedness of the image's corners using the design system's radius scale.\n */\n accessor borderRadius: ImageProps['borderRadius'];\n constructor();\n}" - }, - "Link": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Link", - "description": "Configure the following properties on the link component.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "href", - "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "target", - "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", - "defaultValue": "'auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "download", - "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "lang", - "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", + "name": "__@flushRenderSymbol@16092", "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -102387,24 +114763,30 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Link extends Link_base implements LinkProps {\n accessor tone: LinkProps['tone'];\n accessor accessibilityLabel: LinkProps['accessibilityLabel'];\n accessor href: LinkProps['href'];\n accessor target: LinkProps['target'];\n accessor download: LinkProps['download'];\n accessor lang: LinkProps['lang'];\n constructor();\n}" + "value": "declare class Link extends LinkBase implements LinkProps {\n tone: LinkProps['tone'];\n constructor();\n}" }, "ListItem": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItem", - "description": "The list item component represents a single entry within an ordered list or unordered list. Use list item to structure individual points, steps, or items within a list, with each item automatically receiving appropriate list markers (bullets or numbers) from its parent list.\n\nList item must be used as a direct child of ordered list or unordered list components. Each list item can contain text, inline formatting, or other components to create rich list content.", - "isPublicDocs": true, + "description": "A component that represents a single item within an ordered list or unordered list.\n\nUse list item as a child of ordered list or unordered list to create properly structured and accessible list content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -102450,7 +114832,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -102458,24 +114840,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ListItem extends PreactCustomElement implements ListItemProps {\n constructor();\n}" + "value": "declare class ListItem extends PolarisCustomElement implements ListItemProps {\n constructor();\n}" }, "Menu": { "filePath": "src/surfaces/admin/components.ts", "name": "Menu", - "description": "Configure the following properties on the menu component.", - "isPublicDocs": true, + "description": "A component that displays a contextual list of actions or options, which is typically triggered by a button or other activator element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the menu for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", @@ -102496,7 +114892,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -102504,7 +114900,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -102512,11 +114908,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -102546,7 +114949,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -102554,24 +114957,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n accessor accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n /**\n * A label that describes the menu for assistive technologies.\n */\n accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "MoneyField": { "filePath": "src/surfaces/admin/components.ts", "name": "MoneyField", - "description": "Configure the following properties on the money field component.", - "isPublicDocs": true, + "description": "The money field custom element class that renders a monetary input field in the Shopify admin interface. This component allows merchants to enter currency amounts with automatic formatting, decimal precision, and validation against minimum and maximum values.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum monetary value allowed in the field.", "defaultValue": "Infinity" }, { @@ -102579,9 +114996,17 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum monetary value allowed in the field.", "defaultValue": "-Infinity" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "currencyCode", + "value": "\"auto\" | CurrencyCode", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -102594,7 +115019,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "string", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -102602,35 +115027,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -102638,14 +115063,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -102653,7 +115078,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -102677,7 +115102,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -102701,7 +115126,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -102709,23 +115134,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -102763,7 +115195,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -102771,17 +115203,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class MoneyField\n extends PreactFieldElement\n implements MoneyFieldProps\n{\n accessor max: MoneyFieldProps['max'];\n accessor min: MoneyFieldProps['min'];\n /**\n * The current monetary value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string representing the amount in the store's currency.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class MoneyField extends MoneyFieldBase implements MoneyFieldProps {\n constructor();\n}" + }, + "CurrencyCode": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CurrencyCode", + "value": "'USD' | 'EUR' | 'GBP' | 'CAD' | 'AFN' | 'ALL' | 'DZD' | 'AOA' | 'ARS' | 'AMD' | 'AWG' | 'AUD' | 'BBD' | 'AZN' | 'BDT' | 'BSD' | 'BHD' | 'BIF' | 'BZD' | 'BMD' | 'BTN' | 'BAM' | 'BRL' | 'BOB' | 'BWP' | 'BND' | 'BGN' | 'MMK' | 'KHR' | 'CVE' | 'KYD' | 'XAF' | 'CLP' | 'CNY' | 'COP' | 'KMF' | 'CDF' | 'CRC' | 'HRK' | 'CZK' | 'DKK' | 'DOP' | 'XCD' | 'EGP' | 'ETB' | 'XPF' | 'FJD' | 'GMD' | 'GHS' | 'GTQ' | 'GYD' | 'GEL' | 'HTG' | 'HNL' | 'HKD' | 'HUF' | 'ISK' | 'INR' | 'IDR' | 'ILS' | 'IQD' | 'JMD' | 'JPY' | 'JEP' | 'JOD' | 'KZT' | 'KES' | 'KWD' | 'KGS' | 'LAK' | 'LVL' | 'LBP' | 'LSL' | 'LRD' | 'LTL' | 'MGA' | 'MKD' | 'MOP' | 'MWK' | 'MVR' | 'MXN' | 'MYR' | 'MUR' | 'MDL' | 'MAD' | 'MNT' | 'MZN' | 'NAD' | 'NPR' | 'ANG' | 'NZD' | 'NIO' | 'NGN' | 'NOK' | 'OMR' | 'PAB' | 'PKR' | 'PGK' | 'PYG' | 'PEN' | 'PHP' | 'PLN' | 'QAR' | 'RON' | 'RUB' | 'RWF' | 'WST' | 'SAR' | 'RSD' | 'SCR' | 'SGD' | 'SDG' | 'SYP' | 'ZAR' | 'KRW' | 'SSP' | 'SBD' | 'LKR' | 'SRD' | 'SZL' | 'SEK' | 'CHF' | 'TWD' | 'THB' | 'TZS' | 'TTD' | 'TND' | 'TRY' | 'TMT' | 'UGX' | 'UAH' | 'AED' | 'UYU' | 'UZS' | 'VUV' | 'VND' | 'XOF' | 'YER' | 'ZMW' | 'BYN' | 'BYR' | 'DJF' | 'ERN' | 'FKP' | 'GIP' | 'GNF' | 'IRR' | 'KID' | 'LYD' | 'MRU' | 'SLL' | 'SHP' | 'SOS' | 'STD' | 'STN' | 'TJS' | 'TOP' | 'VED' | 'VEF' | 'VES' | 'XXX'", + "description": "" }, "NumberField": { "filePath": "src/surfaces/admin/components.ts", "name": "NumberField", - "description": "Configure the following properties on the number field component.", - "isPublicDocs": true, + "description": "The number field custom element class that renders a numeric input field in the Shopify admin interface. This component allows merchants to enter numbers with automatic validation and prefix/suffix display.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -102795,7 +115248,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inputMode", "value": "\"decimal\" | \"numeric\"", - "description": "The type of virtual keyboard to display on mobile devices.\n\n- `decimal`: Shows a numeric keyboard with a decimal point, suitable for prices or measurements.\n- `numeric`: Shows a numeric keyboard without a decimal point, suitable for whole numbers like quantities.\n\nLearn more about the [inputmode attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode).", + "description": "The input mode hint for mobile keyboards. Available values include:\n- `numeric`: Shows a numeric keypad optimized for entering numbers\n- `decimal`: Shows a numeric keypad with decimal point support\n- `tel`: Shows a telephone keypad", "defaultValue": "'decimal'" }, { @@ -102803,7 +115256,7 @@ "syntaxKind": "PropertyDeclaration", "name": "step", "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "description": "The granularity that the value must adhere to, or the keyword `any`. This controls the increment/decrement step size.", "defaultValue": "1" }, { @@ -102811,7 +115264,7 @@ "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum numeric value allowed in the field.", "defaultValue": "Infinity" }, { @@ -102819,7 +115272,7 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum numeric value allowed in the field.", "defaultValue": "-Infinity" }, { @@ -102827,7 +115280,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the user's input, such as a currency symbol.", "defaultValue": "''" }, { @@ -102835,7 +115288,7 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the user's input, such as a unit of measurement.", "defaultValue": "''" }, { @@ -102843,7 +115296,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | NumberAutocompleteField | `section-${string} one-time-code` | `section-${string} cc-number` | `section-${string} cc-csc` | \"shipping one-time-code\" | \"shipping cc-number\" | \"shipping cc-csc\" | \"billing one-time-code\" | \"billing cc-number\" | \"billing cc-csc\" | `section-${string} shipping one-time-code` | `section-${string} shipping cc-number` | `section-${string} shipping cc-csc` | `section-${string} billing one-time-code` | `section-${string} billing cc-number` | `section-${string} billing cc-csc`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -102851,35 +115304,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -102887,14 +115340,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -102902,7 +115355,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -102926,7 +115379,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -102950,7 +115403,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -102958,23 +115411,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -103012,7 +115472,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -103020,32 +115480,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class NumberField\n extends PreactFieldElement\n implements NumberFieldProps\n{\n /**\n * The current numeric value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string (decimal or integer).\n */\n get value(): string;\n set value(value: string);\n accessor inputMode: NumberFieldProps['inputMode'];\n accessor step: NumberFieldProps['step'];\n accessor max: NumberFieldProps['max'];\n accessor min: NumberFieldProps['min'];\n accessor prefix: NumberFieldProps['prefix'];\n accessor suffix: NumberFieldProps['suffix'];\n constructor();\n}" + "value": "declare class NumberField extends NumberFieldBase implements NumberFieldProps {\n constructor();\n}" }, "NumberAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "NumberAutocompleteField", "value": "'one-time-code' | 'cc-number' | 'cc-csc'", - "description": "Represents autocomplete values that are valid for number input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for numeric inputs.\n\nAvailable values:\n- `one-time-code` - One-time codes for authentication (OTP, 2FA codes)\n- `cc-number` - Credit card number\n- `cc-csc` - Credit card security code (CVV/CVC)", - "isPublicDocs": true + "description": "" }, "Option": { "filePath": "src/surfaces/admin/components.ts", "name": "Option", - "description": "Represents a single option within a select component. Use only as a child of s-select components.", - "isPublicDocs": true, + "description": "A single option within a select dropdown that users can choose.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the option is currently selected.", "defaultValue": "false" }, { @@ -103053,7 +115526,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the option should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -103061,16 +115534,23 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this option is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the option is disabled and can't be selected.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -103116,7 +115596,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -103124,24 +115604,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Option extends PreactCustomElement implements OptionProps {\n accessor selected: OptionProps['selected'];\n accessor defaultSelected: OptionProps['defaultSelected'];\n accessor value: OptionProps['value'];\n accessor disabled: OptionProps['disabled'];\n constructor();\n}" + "value": "declare class Option extends PolarisCustomElement implements OptionProps {\n /**\n * Whether the option is currently selected.\n */\n selected: OptionProps['selected'];\n /**\n * Whether the option should be selected when it's first rendered.\n */\n defaultSelected: OptionProps['defaultSelected'];\n /**\n * The value that's submitted with the form when this option is selected.\n */\n value: OptionProps['value'];\n /**\n * Whether the option is disabled and can't be selected.\n */\n disabled: OptionProps['disabled'];\n constructor();\n}" }, "OptionGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionGroup", - "description": "Represents a group of options within a select component. Use only as a child of `s-select` components.", - "isPublicDocs": true, + "description": "A group of related options within a select dropdown, displayed with a label.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the options within this group can be selected or not.", + "description": "Whether all options in the group are disabled and can't be selected.", "defaultValue": "false" }, { @@ -103149,7 +115643,14 @@ "syntaxKind": "PropertyDeclaration", "name": "label", "value": "string", - "description": "The user-facing label for this group of options." + "description": "The text that describes what this group of options represents." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -103196,7 +115697,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -103204,18 +115705,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OptionGroup\n extends PreactCustomElement\n implements OptionGroupProps\n{\n accessor disabled: OptionGroupProps['disabled'];\n accessor label: OptionGroupProps['label'];\n constructor();\n}" + "value": "declare class OptionGroup\n extends PolarisCustomElement\n implements OptionGroupProps\n{\n /**\n * Whether all options in the group are disabled and can't be selected.\n */\n disabled: OptionGroupProps['disabled'];\n /**\n * The text that describes what this group of options represents.\n */\n label: OptionGroupProps['label'];\n constructor();\n}" }, "OrderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "OrderedList", - "description": "Configure the following properties on the ordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a numbered list of items with automatic numbering and proper list semantics. Use ordered list when the sequence or order of items matters, such as instructions, rankings, or step-by-step processes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -103261,7 +115783,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -103269,48 +115791,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OrderedList\n extends PreactCustomElement\n implements OrderedListProps\n{\n constructor();\n}" + "value": "declare class OrderedList\n extends PolarisCustomElement\n implements OrderedListProps\n{\n constructor();\n}" }, "Paragraph": { "filePath": "src/surfaces/admin/components.ts", "name": "Paragraph", - "description": "Configure the following properties on the paragraph component.", - "isPublicDocs": true, + "description": "A custom element for displaying blocks of text content with consistent spacing and styling for readable body copy. Use Paragraph to render longer text content with proper line height and spacing between paragraphs.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "lineClamp", - "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", - "defaultValue": "Infinity - no truncation is applied" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the paragraph text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"caution\"", - "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "lineClamp", + "value": "number", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", + "defaultValue": "Infinity - no truncation is applied" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color of the paragraph text.", "defaultValue": "'base'" }, { @@ -103318,7 +115854,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -103326,9 +115862,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -103374,7 +115917,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -103382,24 +115925,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Paragraph extends PreactCustomElement implements ParagraphProps {\n accessor fontVariantNumeric: ParagraphProps['fontVariantNumeric'];\n accessor lineClamp: ParagraphProps['lineClamp'];\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: ParagraphProps['tone'];\n\n accessor color: ParagraphProps['color'];\n accessor dir: ParagraphProps['dir'];\n accessor accessibilityVisibility: ParagraphProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Paragraph extends ParagraphBase implements ParagraphProps {\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: ParagraphProps['tone'];\n constructor();\n}" }, "PasswordField": { "filePath": "src/surfaces/admin/components.ts", "name": "PasswordField", - "description": "Configure the following properties on the password field component.", - "isPublicDocs": true, + "description": "The password field custom element class that renders a password input field in the Shopify admin interface. This component allows merchants to enter passwords securely with characters automatically masked for privacy.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the password.", "defaultValue": "Infinity" }, { @@ -103407,22 +115964,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the password.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | PasswordAutocompleteField | `section-${string} current-password` | `section-${string} new-password` | \"shipping current-password\" | \"shipping new-password\" | \"billing current-password\" | \"billing new-password\" | `section-${string} shipping current-password` | `section-${string} shipping new-password` | `section-${string} billing current-password` | `section-${string} billing new-password`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -103430,35 +115980,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -103466,14 +116016,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -103481,7 +116031,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -103505,7 +116055,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -103529,7 +116079,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -103537,23 +116087,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -103591,7 +116155,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -103599,34 +116163,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class PasswordField\n extends PreactFieldElement\n implements PasswordFieldProps\n{\n accessor maxLength: PasswordFieldProps['maxLength'];\n accessor minLength: PasswordFieldProps['minLength'];\n /**\n * The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class PasswordField\n extends PasswordFieldBase\n implements PasswordFieldProps\n{\n constructor();\n}" }, "PasswordAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PasswordAutocompleteField", "value": "'current-password' | 'new-password'", - "description": "Represents autocomplete values that are valid for password input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for password inputs.\n\nAvailable values:\n- `current-password` - Existing password for login or authentication\n- `new-password` - New password when creating an account or changing password", - "isPublicDocs": true + "description": "" }, "QueryContainer": { "filePath": "src/surfaces/admin/components.ts", "name": "QueryContainer", - "description": "Configure the following properties on the query container component.", - "isPublicDocs": true, + "description": "A component that sets up a container query context, which lets child elements style themselves based on the container's size instead of the viewport size.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "containerName", "value": "string", - "description": "An identifier for this container that you can reference in CSS container queries to apply styles based on this specific container's size.\n\nAll query container components automatically receive a container name of `s-default`. You can omit the container name in your queries, so `@container (inline-size <= 300px)` is equivalent to `@container s-default (inline-size <= 300px)`.\n\nWhen you provide a custom `containerName`, it's added alongside `s-default`. For example, `containerName=\"product-card\"` results in `s-default product-card` being set on the `container-name` CSS property, allowing you to target this container with `@container product-card (inline-size <= 300px)`.\n\nLearn more about the [container-name property](https://developer.mozilla.org/en-US/docs/Web/CSS/container-name).", + "description": "The name of the container, which you can reference in CSS container queries.", "defaultValue": "''" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -103672,7 +116256,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -103680,24 +116264,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class QueryContainer\n extends PreactCustomElement\n implements QueryContainerProps\n{\n accessor containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" + "value": "declare class QueryContainer\n extends PolarisCustomElement\n implements QueryContainerProps\n{\n /**\n * The name of the container, which you can reference in CSS container queries.\n */\n containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" }, "SearchField": { "filePath": "src/surfaces/admin/components.ts", "name": "SearchField", - "description": "Configure the following properties on the search field component.", - "isPublicDocs": true, + "description": "A search field that lets users enter search queries with a search-specific input type.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters that can be entered in the field.", "defaultValue": "Infinity" }, { @@ -103705,22 +116303,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters that must be entered for the field to be valid.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -103728,35 +116319,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -103764,14 +116355,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -103779,7 +116370,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -103803,7 +116394,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -103827,7 +116418,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -103835,23 +116426,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -103889,7 +116494,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -103897,25 +116502,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class SearchField\n extends PreactFieldElement\n implements SearchFieldProps\n{\n accessor maxLength: SearchFieldProps['maxLength'];\n accessor minLength: SearchFieldProps['minLength'];\n /**\n * The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class SearchField extends SearchFieldBase implements SearchFieldProps {\n constructor();\n}" }, "TextAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" }, "Section": { "filePath": "src/surfaces/admin/components.ts", "name": "Section", - "description": "Configure the following properties on the section component.", - "isPublicDocs": true, + "description": "A section is a container that groups related content together with an optional heading.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -103925,28 +116543,43 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "The accessibility label for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The heading text displayed at the top of the section. This heading provides a title for the section's content and automatically uses the appropriate semantic heading level (h2, h3, h4) based on nesting depth to maintain proper document structure." + "description": "The heading text for the section." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "\"base\" | \"none\"", - "description": "The padding applied to all edges of the element.\n\n- `base`: applies padding that is appropriate for the element. Note that it might result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the section need to span to the edge of the section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "description": "Whether the section has padding.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -103963,14 +116596,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -103984,7 +116609,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -103992,59 +116617,73 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Section extends PreactCustomElement implements SectionProps {\n constructor();\n /** @private */\n connectedCallback(): void;\n accessor accessibilityLabel: SectionProps['accessibilityLabel'];\n accessor heading: SectionProps['heading'];\n accessor padding: SectionProps['padding'];\n}" + "value": "declare class Section extends SectionBase implements SectionProps {\n constructor();\n}" }, "Select": { "filePath": "src/surfaces/admin/components.ts", "name": "Select", - "description": "Configure the following properties on the select component.", - "isPublicDocs": true, + "description": "A select dropdown that lets users choose one option from a list.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier." + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the select." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the select when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the select is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "Text that appears in the select when no option is selected to provide a hint about what to choose." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether an option must be selected before the form can be submitted.", "defaultValue": "false" }, { @@ -104052,7 +116691,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -104076,7 +116715,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component." + "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected Option component." }, { "filePath": "src/surfaces/admin/components.ts", @@ -104089,15 +116728,15 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@usedFirstOptionSymbol@12029", + "name": "__@usedFirstOptionSymbol@17470", "value": "boolean", - "description": "A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n\nThis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.", + "description": "used to determine if no value or defaultValue was set, in which case the first non-disabled option was used\n\nthis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@hasInitialValueSymbol@12030", + "name": "__@hasInitialValueSymbol@17471", "value": "boolean", "description": "", "isPrivate": true @@ -104107,7 +116746,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -104115,23 +116754,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -104161,7 +116807,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -104169,33 +116815,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Select extends PreactInputElement implements SelectProps {\n accessor icon: SelectProps['icon'];\n accessor details: SelectProps['details'];\n accessor error: SelectProps['error'];\n accessor label: SelectProps['label'];\n accessor placeholder: SelectProps['placeholder'];\n accessor required: SelectProps['required'];\n accessor labelAccessibilityVisibility: SelectProps['labelAccessibilityVisibility'];\n /** @private */\n connectedCallback(): void;\n /**\n * A lifecycle callback that fires when the component is removed from the DOM. Performs cleanup operations.\n * @private\n */\n disconnectedCallback(): void;\n constructor();\n /**\n * A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n *\n * This is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.\n * @private\n */\n [usedFirstOptionSymbol]: boolean;\n /**\n * @private\n */\n [hasInitialValueSymbol]: boolean;\n /**\n * The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component.\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n}" + "value": "declare class Select extends SelectBase implements SelectProps {\n constructor();\n}" }, "Spinner": { "filePath": "src/surfaces/admin/components.ts", "name": "Spinner", - "description": "Configure the following properties on the spinner component.", - "isPublicDocs": true, + "description": "A component that displays an animated loading indicator to show that content is currently being processed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the spinner for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the loading spinner.\n\n- `base`: Default size suitable for inline loading indicators or standard UI contexts.\n- `large`: Larger spinner for more prominent loading states.\n- `large-100`: Extra large spinner for full-page or emphasized loading states.", + "description": "The size of the spinner.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -104241,7 +116908,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -104249,24 +116916,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Spinner extends PreactCustomElement implements SpinnerProps {\n accessor accessibilityLabel: string;\n accessor size: SpinnerProps['size'];\n constructor();\n}" + "value": "declare class Spinner extends PolarisCustomElement implements SpinnerProps {\n /**\n * A label that describes the spinner for assistive technologies.\n */\n accessibilityLabel: string;\n /**\n * The size of the spinner.\n */\n size: SpinnerProps['size'];\n constructor();\n}" }, "Stack": { "filePath": "src/surfaces/admin/components.ts", "name": "Stack", - "description": "Configure the following properties on the stack component.", - "isPublicDocs": true, + "description": "A stack is a layout component that arranges its children in a single direction with controlled spacing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "direction", "value": "MaybeResponsive<\"inline\" | \"block\">", - "description": "The direction in which the stack's children are placed within the stack.\n\nAccepts:\n- A single value, either `inline` or `block`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported direction values as a query value", + "description": "The direction in which the stack's children are arranged.", "defaultValue": "'block'" }, { @@ -104274,7 +116955,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "JustifyContentKeyword", - "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -104282,7 +116963,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "AlignItemsKeyword", - "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -104290,7 +116971,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "AlignContentKeyword", - "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.", "defaultValue": "'normal'" }, { @@ -104298,7 +116979,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between the stack's children.", "defaultValue": "'none'" }, { @@ -104306,7 +116987,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between rows in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -104314,7 +116995,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between columns in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -104322,7 +117003,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -104330,7 +117011,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -104338,7 +117019,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -104346,7 +117027,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -104354,7 +117035,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -104362,7 +117043,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -104370,7 +117051,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -104378,7 +117059,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -104386,7 +117067,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -104394,7 +117075,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -104402,7 +117083,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -104410,7 +117091,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -104418,7 +117099,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -104426,7 +117107,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -104434,7 +117115,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -104442,7 +117123,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -104450,7 +117131,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -104470,7 +117151,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -104478,7 +117159,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -104486,7 +117167,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -104494,7 +117175,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -104502,14 +117183,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -104517,9 +117198,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -104565,7 +117253,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -104573,32 +117261,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n accessor direction: StackProps['direction'];\n accessor justifyContent: StackProps['justifyContent'];\n accessor alignItems: StackProps['alignItems'];\n accessor alignContent: StackProps['alignContent'];\n accessor gap: StackProps['gap'];\n accessor rowGap: StackProps['rowGap'];\n accessor columnGap: StackProps['columnGap'];\n}" + "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n /**\n * The direction in which the stack's children are arranged.\n */\n direction: StackProps['direction'];\n /**\n * Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n */\n justifyContent: StackProps['justifyContent'];\n /**\n * Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n */\n alignItems: StackProps['alignItems'];\n /**\n * Controls the distribution of lines along the block axis when content wraps into multiple lines.\n */\n alignContent: StackProps['alignContent'];\n /**\n * The spacing between the stack's children.\n */\n gap: StackProps['gap'];\n /**\n * The spacing between rows in the stack.\n */\n rowGap: StackProps['rowGap'];\n /**\n * The spacing between columns in the stack.\n */\n columnGap: StackProps['columnGap'];\n}" }, "Switch": { "filePath": "src/surfaces/admin/components.ts", "name": "Switch", - "description": "Configure the following properties on the switch component.", - "isPublicDocs": true, + "description": "A switch that lets users toggle a setting on or off with a sliding control.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -104613,7 +117322,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -104621,28 +117330,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -104665,7 +117374,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -104673,23 +117382,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -104735,7 +117451,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -104743,24 +117459,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Switch extends PreactCheckboxElement implements SwitchProps {\n accessor labelAccessibilityVisibility: SwitchProps['labelAccessibilityVisibility'];\n constructor();\n}" + "value": "declare class Switch extends SwitchBase implements SwitchProps {\n constructor();\n}" }, "Table": { "filePath": "src/surfaces/admin/components.ts", "name": "Table", - "description": "Configure the following properties on the table component.", - "isPublicDocs": true, + "description": "A component that displays data in a structured table format that automatically adapts to the available space.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "variant", "value": "\"auto\" | \"list\"", - "description": "The layout variant of the table component.\n\n- `list`: Always displays as a list layout.\n- `table`: Always displays as a traditional table layout.\n- `auto`: Automatically displays as a table on wide screens and as a list on narrow screens.", + "description": "The display variant of the table.", "defaultValue": "'auto'" }, { @@ -104768,7 +117498,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table. When `true`, the table might be in an inert state that prevents user interaction.", + "description": "Whether the table is currently in a loading state.", "defaultValue": "false" }, { @@ -104776,7 +117506,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paginate", "value": "boolean", - "description": "Whether to use pagination controls.", + "description": "Whether the pagination controls are displayed.", "defaultValue": "false" }, { @@ -104784,7 +117514,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hasPreviousPage", "value": "boolean", - "description": "Whether there's a previous page of data.", + "description": "Whether there's a previous page of data that the user can navigate to.", "defaultValue": "false" }, { @@ -104792,25 +117522,40 @@ "syntaxKind": "PropertyDeclaration", "name": "hasNextPage", "value": "boolean", - "description": "Whether there's an additional page of data.", + "description": "Whether there's a next page of data that the user can navigate to.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@actualTableVariantSymbol@12105", - "value": "AddedContext", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@actualTableVariantSymbol@17550", + "value": "_shopify_admin_web_component_foundations.AddedContext", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@tableHeadersSharedDataSymbol@12106", - "value": "AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", + "name": "__@tableHeadersSharedDataSymbol@17551", + "value": "_shopify_admin_web_component_foundations.AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -104856,7 +117601,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -104864,78 +117609,69 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Table extends PreactCustomElement implements TableProps {\n accessor variant: TableProps['variant'];\n accessor loading: TableProps['loading'];\n accessor paginate: TableProps['paginate'];\n accessor hasPreviousPage: TableProps['hasPreviousPage'];\n accessor hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" - }, - "AddedContext": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AddedContext", - "description": "", - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "T", - "description": "The current context value.\n\nThe new context value to set, which will notify all consumers." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "addEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", - "description": "The **`addEventListener()`** method of the EventTarget interface sets up a function that will be called whenever the specified event is delivered to the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener)" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "dispatchEvent", - "value": "(event: Event) => boolean", - "description": "The **`dispatchEvent()`** method of the EventTarget sends an Event to the object, (synchronously) invoking the affected event listeners in the appropriate order.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/dispatchEvent)" + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "removeEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", - "description": "The **`removeEventListener()`** method of the EventTarget interface removes an event listener previously registered with EventTarget.addEventListener() from the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/removeEventListener)" + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AddedContext extends EventTarget {\n constructor(defaultValue: T);\n /**\n * The current context value.\n */\n get value(): T;\n /**\n * The new context value to set, which will notify all consumers.\n */\n set value(value: T);\n}" + "value": "declare class Table extends PolarisCustomElement implements TableProps {\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The display variant of the table.\n */\n variant: TableProps['variant'];\n /**\n * Whether the table is currently in a loading state.\n */\n loading: TableProps['loading'];\n /**\n * Whether the pagination controls are displayed.\n */\n paginate: TableProps['paginate'];\n /**\n * Whether there's a previous page of data that the user can navigate to.\n */\n hasPreviousPage: TableProps['hasPreviousPage'];\n /**\n * Whether there's a next page of data that the user can navigate to.\n */\n hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: _shopify_admin_web_component_foundations.AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: _shopify_admin_web_component_foundations.AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" }, "ActualTableVariant": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ActualTableVariant", "value": "'table' | 'list'", - "description": "Represents the actual rendered variant of a table component.\n- `table`: Displays as a traditional table layout.\n- `list`: Displays as a list layout.", - "isPublicDocs": true + "description": "" }, "ListSlotType": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ListSlotType", "value": "'primary' | 'secondary' | 'kicker' | 'inline' | 'labeled'", - "description": "Represents the semantic type of content slots within list items.\n\n- `primary`: The main content or title of the list item.\n- `secondary`: Supporting or descriptive content below the primary content.\n- `kicker`: A small label or tag displayed above the primary content.\n- `inline`: Content displayed inline with the primary content.\n- `labeled`: Content with an associated label.", - "isPublicDocs": true + "description": "" }, "HeaderFormat": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true }, "TableBody": { "filePath": "src/surfaces/admin/components.ts", "name": "TableBody", - "description": "The table body component represents the main content area of a table, containing the data rows. Use table body as a child of table to structure your table data, with each table row within the body representing a single record or entry.\n\nTable body must contain table row components, which in turn contain table cell components for the actual data values.", - "isPublicDocs": true, + "description": "A component that wraps the body content of a table, which contains the data rows.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -104981,7 +117717,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -104989,26 +117725,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableBody extends PreactCustomElement implements TableBodyProps {\n constructor();\n}" + "value": "declare class TableBody extends PolarisCustomElement implements TableBodyProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n}" }, "TableCell": { "filePath": "src/surfaces/admin/components.ts", "name": "TableCell", - "description": "The table cell component represents a single data cell within a table row. Use table cell as a child of table row to display individual data values, with each cell corresponding to a column in the table.\n\nTable cell automatically inherits styling and alignment from its parent table structure and supports text content or other inline components.", - "isPublicDocs": true, + "description": "A component that represents a single cell in a table row, which displays data in a format that's determined by its column header.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", - "name": "__@headerFormatSymbol@12128", + "name": "__@headerFormatSymbol@17578", "value": "HeaderFormat", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -105054,7 +117819,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -105062,24 +117827,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableCell extends PreactCustomElement implements TableCellProps {\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" + "value": "declare class TableCell extends PolarisCustomElement implements TableCellProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" }, "TableHeader": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeader", - "description": "The table header component represents a single column header within a table header row. Use table header as a child of table header row to define column headings and optionally enable column sorting.\n\nTable header provides semantic meaning for screen readers and can include sorting controls when configured. Each header corresponds to a column in the table body.", - "isPublicDocs": true, + "description": "A component that defines a column header in a table, which specifies both the header label and how the column's data should be formatted.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "listSlot", "value": "ListSlotType", - "description": "The content designation for this column when the table displays in list variant on mobile devices.", + "description": "The slot where this header's data appears when the table is shown in list view.", "defaultValue": "'labeled'" }, { @@ -105087,7 +117866,22 @@ "syntaxKind": "PropertyDeclaration", "name": "format", "value": "HeaderFormat", - "description": "The format of the column that controls styling and alignment of cell content." + "description": "The format of the header and its corresponding cells." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -105134,7 +117928,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -105142,17 +117936,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeader\n extends PreactCustomElement\n implements TableHeaderProps\n{\n accessor listSlot: TableHeaderProps['listSlot'];\n accessor format: TableHeaderProps['format'];\n constructor();\n}" + "value": "declare class TableHeader\n extends PolarisCustomElement\n implements TableHeaderProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The slot where this header's data appears when the table is shown in list view.\n */\n listSlot: TableHeaderProps['listSlot'];\n /**\n * The format of the header and its corresponding cells.\n */\n format: TableHeaderProps['format'];\n constructor();\n}" }, "TableHeaderRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeaderRow", - "description": "The table header row component represents the header row of a table, containing column headings. Use table header row as the first child of table (before table body) to define the table structure and provide column labels.\n\nTable header row must contain table header components for each column. These headers provide context for the data columns and can support sorting functionality.", - "isPublicDocs": true, + "description": "A component that wraps the header row of a table, which contains the table header components that define the column structure.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -105170,6 +117978,21 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -105199,7 +118022,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -105207,24 +118030,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeaderRow\n extends PreactCustomElement\n implements TableHeaderRowProps\n{\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class TableHeaderRow\n extends PolarisCustomElement\n implements TableHeaderRowProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "TableRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableRow", - "description": "The table row component represents a single row of data within a table body. Use table row as a child of table body to structure individual records or entries in the table.\n\nTable row must contain table cell components, with each cell representing a data value for the corresponding column. The number of cells should match the number of headers in the table.", - "isPublicDocs": true, + "description": "A component that represents a single row in a table, which contains the data cells.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "clickDelegate", "value": "string", - "description": "The ID of an interactive element, such as `s-link`, in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally." + "description": "A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -105271,7 +118123,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -105279,41 +118131,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableRow extends PreactCustomElement implements TableRowProps {\n constructor();\n accessor clickDelegate: string;\n}" + "value": "declare class TableRow extends PolarisCustomElement implements TableRowProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /**\n * A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector.\n */\n clickDelegate: string;\n}" }, "Text": { "filePath": "src/surfaces/admin/components.ts", "name": "Text", - "description": "Configure the following properties on the text component.", - "isPublicDocs": true, + "description": "A custom element for displaying inline or small blocks of text with various visual styles and semantic meanings. Use Text to render short pieces of content with appropriate styling, emphasis, and color treatment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color of the text.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", @@ -105328,7 +118194,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -105336,7 +118202,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, { @@ -105344,7 +118210,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The ID of an element this text provides contextual information for." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -105391,7 +118264,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -105399,24 +118272,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Text extends PreactCustomElement implements TextProps {\n accessor fontVariantNumeric: TextProps['fontVariantNumeric'];\n accessor color: TextProps['color'];\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: TextProps['tone'];\n /**\n * The semantic type and styling treatment for the text content.\n *\n * - `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n * - `generic`: Standard text with no special semantic meaning or styling.\n * - `address`: Marks the text as contact information, such as a physical or email address.\n * - `redundant`: Indicates the text is redundant or duplicated information for screen reader context.\n */\n accessor type: TextProps['type'];\n accessor dir: TextProps['dir'];\n accessor accessibilityVisibility: TextProps['accessibilityVisibility'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Text extends TextBase implements TextProps {\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: TextProps['tone'];\n constructor();\n}" }, "TextArea": { "filePath": "src/surfaces/admin/components.ts", "name": "TextArea", - "description": "Configure the following properties on the text area component.", - "isPublicDocs": true, + "description": "The text area custom element class that renders a multi-line text input field in the Shopify admin interface. This component allows merchants to enter and edit longer text content with support for labels, validation, and length constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -105424,7 +118311,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, { @@ -105432,22 +118319,15 @@ "syntaxKind": "PropertyDeclaration", "name": "rows", "value": "number", - "description": "A number of visible text lines.", + "description": "The number of visible text lines for the field, controlling its initial height.", "defaultValue": "2" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -105455,35 +118335,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -105491,14 +118371,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -105506,7 +118386,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -105530,7 +118410,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -105554,7 +118434,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -105562,23 +118442,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -105616,7 +118510,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -105624,24 +118518,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextArea\n extends PreactFieldElement\n implements TextAreaProps\n{\n accessor maxLength: TextAreaProps['maxLength'];\n accessor minLength: TextAreaProps['minLength'];\n accessor rows: TextAreaProps['rows'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextArea extends TextAreaBase implements TextAreaProps {\n constructor();\n}" }, "TextField": { "filePath": "src/surfaces/admin/components.ts", "name": "TextField", - "description": "Configure the following properties on the text field component.", - "isPublicDocs": true, + "description": "The text field custom element class that renders a single-line text input field in the Shopify admin interface. This component allows merchants to enter and edit text with support for labels, validation, icons, and prefix/suffix content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\" | AnyString", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "value": "IconType | AnyString", + "description": "An icon to display at the start of the text field, providing visual context for the input. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", "defaultValue": "''" }, { @@ -105649,7 +118557,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the merchant can enter in the field. When this limit is reached, the field prevents further input.", "defaultValue": "Infinity" }, { @@ -105657,7 +118565,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation. The field will be considered invalid if the merchant enters fewer characters than this value.", "defaultValue": "0" }, { @@ -105665,7 +118573,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the merchant's input, such as a currency symbol (`$`) or protocol (`https://`).", "defaultValue": "''" }, { @@ -105673,22 +118581,15 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the merchant's input, such as a unit of measurement (`kg`, `%`) or domain (`.myshopify.com`).", "defaultValue": "''" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -105696,35 +118597,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -105732,14 +118633,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -105747,7 +118648,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -105771,7 +118672,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -105795,7 +118696,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -105803,23 +118704,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -105857,7 +118772,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -105865,41 +118780,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextField\n extends PreactFieldElement\n implements TextFieldProps\n{\n accessor icon: TextFieldProps['icon'];\n accessor maxLength: TextFieldProps['maxLength'];\n accessor minLength: TextFieldProps['minLength'];\n accessor prefix: TextFieldProps['prefix'];\n accessor suffix: TextFieldProps['suffix'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextField extends TextFieldBase implements TextFieldProps {\n constructor();\n}" }, "Thumbnail": { "filePath": "src/surfaces/admin/components.ts", "name": "Thumbnail", - "description": "Configure the following properties on the thumbnail component.", - "isPublicDocs": true, + "description": "A thumbnail displays a small preview image with configurable sizing.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display in the thumbnail." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the product thumbnail image.\n\n- `small-200`: Smallest thumbnail size, ideal for compact product lists or tables.\n- `small-100`: Very small thumbnail, suitable for dense layouts.\n- `small`: Small thumbnail for space-constrained contexts.\n- `base`: Default size that balances visibility and space efficiency.\n- `large`: Larger thumbnail for featured products or detailed views.\n- `large-100`: Extra large thumbnail for prominent product display.", + "description": "The size of the thumbnail.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -105945,7 +118881,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -105953,22 +118889,36 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Thumbnail extends PreactCustomElement implements ThumbnailProps {\n accessor src: ThumbnailProps['src'];\n accessor alt: ThumbnailProps['alt'];\n accessor size: ThumbnailProps['size'];\n constructor();\n}" + "value": "declare class Thumbnail extends PolarisCustomElement implements ThumbnailProps {\n /**\n * The URL of the image to display in the thumbnail.\n */\n src: ThumbnailProps['src'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ThumbnailProps['alt'];\n /**\n * The size of the thumbnail.\n */\n size: ThumbnailProps['size'];\n constructor();\n}" }, "Tooltip": { "filePath": "src/surfaces/admin/components.ts", "name": "Tooltip", - "description": "Configure the following properties on the tooltip component.", - "isPublicDocs": true, + "description": "A component that displays a small popup with explanatory text when the user hovers over or focuses on an element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -105976,7 +118926,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -105984,11 +118934,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -106034,7 +118991,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -106042,8 +118999,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Tooltip extends PreactOverlayElement implements TooltipProps {\n constructor();\n}" @@ -106051,9 +119023,15 @@ "UnorderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "UnorderedList", - "description": "Configure the following properties on the unordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a bulleted list of items where the order doesn't matter. Use unordered list when you have a collection of related items without a specific sequence, such as features, options, or bullet points.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -106099,7 +119077,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -106107,32 +119085,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class UnorderedList\n extends PreactCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" + "value": "declare class UnorderedList\n extends PolarisCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" }, "URLField": { "filePath": "src/surfaces/admin/components.ts", "name": "URLField", - "description": "Configure the following properties on the URL field component.", - "isPublicDocs": true, + "description": "The URL field custom element class that renders a URL input field in the Shopify admin interface. This component allows merchants to enter web addresses with automatic URL validation and appropriate mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | `section-${string} url` | `section-${string} photo` | `section-${string} impp` | `section-${string} home impp` | `section-${string} mobile impp` | `section-${string} fax impp` | `section-${string} pager impp` | \"shipping url\" | \"shipping photo\" | \"shipping impp\" | \"shipping home impp\" | \"shipping mobile impp\" | \"shipping fax impp\" | \"shipping pager impp\" | \"billing url\" | \"billing photo\" | \"billing impp\" | \"billing home impp\" | \"billing mobile impp\" | \"billing fax impp\" | \"billing pager impp\" | `section-${string} shipping url` | `section-${string} shipping photo` | `section-${string} shipping impp` | `section-${string} shipping home impp` | `section-${string} shipping mobile impp` | `section-${string} shipping fax impp` | `section-${string} shipping pager impp` | `section-${string} billing url` | `section-${string} billing photo` | `section-${string} billing impp` | `section-${string} billing home impp` | `section-${string} billing mobile impp` | `section-${string} billing fax impp` | `section-${string} billing pager impp` | URLAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint about the intended content of the field for browser autofill.", + "defaultValue": "'url'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the URL.", "defaultValue": "Infinity" }, { @@ -106140,50 +119132,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the URL.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -106191,14 +119176,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -106206,7 +119191,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -106230,7 +119215,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -106254,7 +119239,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -106262,23 +119247,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -106316,7 +119315,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -106324,41 +119323,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class URLField\n extends PreactFieldElement\n implements URLFieldProps\n{\n accessor autocomplete: URLFieldProps['autocomplete'];\n accessor maxLength: URLFieldProps['maxLength'];\n accessor minLength: URLFieldProps['minLength'];\n /**\n * The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class URLField extends URLFieldBase implements URLFieldProps {\n constructor();\n}" }, "URLAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "URLAutocompleteField", "value": "'url' | 'photo' | 'impp' | 'home impp' | 'mobile impp' | 'fax impp' | 'pager impp'", - "description": "Represents autocomplete values that are valid for URL input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for URL inputs.\n\nAvailable values:\n- `url` - General URL or web address\n- `photo` - URL to a photo or image\n- `impp` - Instant messaging protocol URL\n- `home impp` - Home instant messaging protocol URL\n- `mobile impp` - Mobile instant messaging protocol URL\n- `fax impp` - Fax instant messaging protocol URL\n- `pager impp` - Pager instant messaging protocol URL", - "isPublicDocs": true + "description": "" }, "AdminAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminAction", - "description": "Configure the following properties on the admin action component.", - "isPublicDocs": true, + "description": "The admin action custom element class that renders action controls in the Shopify admin interface. This component creates a standardized action area with a heading and slots for primary and secondary action buttons, used exclusively in admin action extensions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text to use as the Action modal's title. If not provided, the name of the extension will be used." + "description": "The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the action is in a loading state, such as during initial page load or when the action is being opened. When `true`, the action might be in an inert state that prevents user interaction.", + "description": "Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -106404,7 +119423,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -106412,11 +119431,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminAction\n extends PreactCustomElement\n implements AdminActionProps\n{\n /**\n * The text to use as the Action modal's title. If not provided, the name of the extension will be used.\n */\n heading: string;\n /**\n * Whether the action is in a loading state, such as during initial page load or when the action is being opened.\n * When `true`, the action might be in an inert state that prevents user interaction.\n */\n loading: boolean;\n constructor();\n}" + "value": "declare class AdminAction\n extends PolarisCustomElement\n implements AdminActionProps\n{\n /**\n * The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading.\n */\n heading: string;\n /**\n * Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.\n *\n * @default false\n */\n loading: boolean;\n constructor();\n}" }, "RunnableExtension": { "filePath": "src/extension.ts", @@ -106572,22 +119606,28 @@ "AdminBlock": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminBlock", - "description": "Configure the following properties on the admin block component.", - "isPublicDocs": true, + "description": "The admin block custom element class that renders a collapsible content block in the Shopify admin interface. This component organizes content into expandable sections with headings and provides a summary when collapsed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text displayed as the block's title in the header. If not provided, the extension name will be used." + "description": "The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "collapsedSummary", "value": "string", - "description": "The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated." + "description": "The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -106634,7 +119674,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -106642,18 +119682,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminBlock\n extends PreactCustomElement\n implements AdminBlockProps\n{\n /**\n * The text displayed as the block's title in the header. If not provided, the extension name will be used.\n */\n heading: string;\n /**\n * The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated.\n */\n collapsedSummary: string;\n constructor();\n}" + "value": "declare class AdminBlock\n extends PolarisCustomElement\n implements AdminBlockProps\n{\n /**\n * The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed.\n */\n heading: string;\n /**\n * The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed.\n */\n collapsedSummary: string;\n constructor();\n}" }, "Form": { "filePath": "src/surfaces/admin/components.ts", "name": "Form", - "description": "Configure the following properties on the form component.", - "isPublicDocs": true, + "description": "The form custom element class that renders a form container in the Shopify admin interface. This component manages form submission, validation, and reset behavior for collecting merchant input.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -106699,7 +119760,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -106707,11 +119768,114 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Form extends PolarisCustomElement implements FormProps {\n constructor();\n}" + }, + "IntentRenderApi": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderApi", + "description": "The `IntentRenderApi` object provides methods for extensions that render in response to an app intent. Access the intent data to determine what action the merchant requested and use `intents.response` to resolve the intent when complete.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "auth", + "value": "Auth", + "description": "Provides methods for authenticating calls to your app backend. Use the `idToken()` method to retrieve a signed JWT token that verifies the current user's identity for secure server-side operations." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "extension", + "value": "{ target: ExtensionTarget; }", + "description": "The identifier of the running extension target. Use this to determine which target your extension is rendering in and conditionally adjust functionality or UI based on the extension context." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "i18n", + "value": "I18n", + "description": "Utilities for translating content according to the current localization of the admin. Use these methods to provide translated strings that match the merchant's language preferences, ensuring your extension is accessible to a global audience." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "intents", + "value": "IntentRenderIntents", + "description": "Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "picker", + "value": "PickerApi", + "description": "Opens a custom selection dialog with your app-specific data. Use the [Picker API](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/picker-api) to define the picker's heading, items, headers, and selection behavior. Returns a Promise that resolves to a `Picker` object with a `selected` property for accessing the merchant's selection." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "query", + "value": "(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>", + "description": "Executes GraphQL queries against the [GraphQL Admin API](/docs/api/admin-graphql). Use this to fetch shop data, manage resources, or perform mutations. Queries are automatically authenticated with the current user's permissions. Optionally specify GraphQL variables and API version for your query." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "resourcePicker", + "value": "ResourcePickerApi", + "description": "Opens the [resource picker](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/resource-picker-api) modal for selecting products, variants, or collections. Returns the selected resources when the user confirms their selection, or undefined if they cancel." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "storage", + "value": "Storage", + "description": "Provides methods for persisting data in browser storage that is scoped to your extension. Use this to store user preferences, cache data, maintain state across sessions, or save temporary working data. Storage is persistent across page reloads and isolated per extension." } ], - "value": "declare class Form extends PreactCustomElement implements FormProps {\n constructor();\n}" + "value": "export interface IntentRenderApi\n extends StandardRenderingExtensionApi {\n /**\n * Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow.\n */\n intents: IntentRenderIntents;\n}" + }, + "IntentRenderIntents": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderIntents", + "description": "The intents API available to intent render extensions. Unlike other targets where `response` is optional, intent render extensions always run inside an intent workflow so `response` is guaranteed.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled." + } + ], + "value": "export interface IntentRenderIntents {\n /**\n * Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled.\n */\n response: IntentResponseApi;\n}" + }, + "FormExtensionComponents": { + "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "FormExtensionComponents", + "value": "StandardComponents | 'Form'", + "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." }, "StandardApi": { "filePath": "src/surfaces/admin/api/standard/standard.ts", @@ -107365,19 +120529,18 @@ "value": "FormExtensionComponents | 'FunctionSettings'", "description": "The components available for building function settings extensions. Includes all form components plus the function settings component required for function settings configuration." }, - "FormExtensionComponents": { - "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "FormExtensionComponents", - "value": "StandardComponents | 'Form'", - "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." - }, "FunctionSettings": { "filePath": "src/surfaces/admin/components.ts", "name": "FunctionSettings", - "description": "Configure the following properties on the function settings component.", - "isPublicDocs": true, + "description": "The function settings custom element class that renders a specialized form for configuring Shopify Function settings in the admin interface. This component manages function configuration submission, validation, and error handling.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -107423,7 +120586,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -107431,8 +120594,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class FunctionSettings\n extends PreactCustomElement\n implements FunctionSettingsProps\n{\n constructor();\n}" @@ -107519,15 +120697,21 @@ "AdminPrintAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminPrintAction", - "description": "Configure the following properties on the admin print action component.", - "isPublicDocs": true, + "description": "The admin print action custom element class that renders a print interface in the Shopify admin. This component enables merchants to print content from a specified source URL using the browser's print functionality.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The `src` URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs, and images are supported." + "description": "The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -107574,7 +120758,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -107582,11 +120766,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminPrintAction\n extends PreactCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The `src` URL of the preview and the document to print.\n * If not provided, the preview will show an empty state and the print button will be disabled.\n * HTML, PDFs, and images are supported.\n */\n src: string;\n constructor();\n}" + "value": "declare class AdminPrintAction\n extends PolarisCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action.\n */\n src: string;\n constructor();\n}" }, "ProductDetailsConfigurationApi": { "filePath": "src/surfaces/admin/api/product-configuration/product-details-configuration.ts", @@ -108559,6 +121758,13 @@ "value": "RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >", "description": "A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options." }, + { + "filePath": "src/surfaces/admin/extension-targets.ts", + "syntaxKind": "PropertySignature", + "name": "admin.app.intent.render", + "value": "RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >", + "description": "Renders an admin extension for handling app intents." + }, { "filePath": "src/surfaces/admin/extension-targets.ts", "syntaxKind": "PropertySignature", @@ -109086,7 +122292,7 @@ "description": "A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules." } ], - "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n}" + "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n\n /**\n * Renders an admin extension for handling app intents.\n */\n 'admin.app.intent.render': RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >;\n}" }, "RenderExtension": { "filePath": "src/extension.ts", @@ -109276,9 +122482,17 @@ "value": "string | URL", "description": "The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.", + "isOptional": true } ], - "value": "export interface Intents {\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" + "value": "export interface Intents {\n /**\n * Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.\n */\n response?: IntentResponseApi;\n\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" }, "IntentInvokeApi": { "filePath": "src/surfaces/admin/api/intents/intents.ts", @@ -109288,6 +122502,67 @@ "members": [], "value": "export interface IntentInvokeApi {\n (query: IntentQuery): Promise;\n (intentURL: string, options?: IntentQueryOptions): Promise;\n}" }, + "IntentResponseApi": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "IntentResponseApi", + "description": "The `IntentResponseApi` object provides methods for resolving the current intent from within an invoked extension. This API is only present when your extension is running inside an intent workflow.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "closed", + "value": "() => Promise", + "description": "Resolves the current intent as closed without completing the workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "error", + "value": "(message: string, issues?: Issue[]) => Promise", + "description": "Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "ok", + "value": "(data?: { [key: string]: unknown; }) => Promise", + "description": "Resolves the current intent successfully. Pass output data when your intent defines a response schema." + } + ], + "value": "export interface IntentResponseApi {\n /**\n * Resolves the current intent successfully. Pass output data when your intent defines a response schema.\n */\n ok(data?: SuccessIntentResponse['data']): Promise;\n\n /**\n * Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available.\n */\n error(message: string, issues?: Issue[]): Promise;\n\n /**\n * Resolves the current intent as closed without completing the workflow.\n */\n closed(): Promise;\n}" + }, + "Issue": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "Issue", + "description": "A structured issue describing a validation or workflow error.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "code", + "value": "string", + "description": "A machine-readable error code for this issue. Use this for programmatic error handling or logging.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "message", + "value": "string", + "description": "A description of what's wrong with this field. Display this to help merchants understand how to fix the error.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "path", + "value": "string[]", + "description": "The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure.", + "isOptional": true + } + ], + "value": "export interface Issue {\n /** The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure. */\n path?: string[];\n /** A description of what's wrong with this field. Display this to help merchants understand how to fix the error. */\n message?: string;\n /** A machine-readable error code for this issue. Use this for programmatic error handling or logging. */\n code?: string;\n}" + }, "PickerApi": { "filePath": "src/surfaces/admin/api/picker/picker.ts", "name": "PickerApi", @@ -109781,29 +123056,28 @@ "Avatar": { "filePath": "src/surfaces/admin/components.ts", "name": "Avatar", - "description": "Configure the following properties on the avatar component.", - "isPublicDocs": true, + "description": "An avatar displays a user or entity image with fallback initials when the image isn't available.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "initials", "value": "string", - "description": "The initials to display in the avatar when no image is provided or fails to load. Typically one or two characters representing a person's first and last name initials, such as \"JD\" for John Doe." + "description": "The initials to display when no image is provided or if the image fails to load." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The URL or path to the avatar image. When provided, the image takes priority over `initials`. If the image fails to load or loads slowly, `initials` will be rendered as a fallback." + "description": "The URL of the avatar image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"base\" | \"large\" | \"large-200\"", - "description": "The size of the avatar image.\n\n- `small-200`: Extra small avatar, suitable for compact displays or lists with many items.\n- `small`: Small avatar, good for secondary contexts or tight layouts.\n- `base`: Default size that works well in most contexts.\n- `large`: Large avatar for emphasis or when the avatar is a focal point.\n- `large-200`: Extra large avatar for prominent display.", + "description": "The size of the avatar.", "defaultValue": "'base'" }, { @@ -109811,7 +123085,14 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the avatar for accessibility.\n\nProvides a text description of the avatar for users with assistive technology and serves as a fallback when the avatar fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an avatar, it reads this description aloud. When an avatar fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt)." + "description": "Alternative text that describes the avatar for screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -109858,7 +123139,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -109866,17 +123147,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Avatar extends PreactCustomElement implements AvatarProps {\n accessor initials: AvatarProps['initials'];\n accessor src: AvatarProps['src'];\n accessor size: AvatarProps['size'];\n accessor alt: AvatarProps['alt'];\n constructor();\n}" + "value": "declare class Avatar extends PolarisCustomElement implements AvatarProps {\n /**\n * The initials to display when no image is provided or if the image fails to load.\n */\n initials: AvatarProps['initials'];\n /**\n * The URL of the avatar image to display.\n */\n src: AvatarProps['src'];\n /**\n * The size of the avatar.\n */\n size: AvatarProps['size'];\n /**\n * Alternative text that describes the avatar for screen readers.\n */\n alt: AvatarProps['alt'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -109899,68 +123194,75 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred." + "description": "" } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" }, "Badge": { "filePath": "src/surfaces/admin/components.ts", "name": "Badge", - "description": "Configure the following properties on the badge component.", - "isPublicDocs": true, + "description": "The badge custom element class that renders status indicators in the Shopify admin interface. This component displays compact visual indicators with customizable tones, sizes, and optional icons to communicate status information to merchants.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"strong\"", - "description": "Controls the visual weight and emphasis of the badge.\n\n- `base`: Standard weight with moderate emphasis, suitable for most use cases.\n- `strong`: Increased visual weight for higher emphasis and prominence.", - "defaultValue": "'base'" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the badge to provide additional visual context or reinforce the badge's meaning. Accepts any icon name from the icon library or a custom string identifier." + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"strong\"", + "description": "The visual weight of the badge. Available options: `'base'` for standard weight or `'strong'` for increased emphasis.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the badge.\n\n- `base`: Default size suitable for most badge use cases.\n- `large`: Larger badge for increased visibility and prominence.\n- `large-100`: Extra large badge for maximum visibility in emphasized contexts.", + "description": "The size of the badge. Available options: `'base'` for standard size, `'large'` for larger size, or `'large-100'` for extra large size.", "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", - "defaultValue": "'auto'" + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -110007,7 +123309,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -110015,17 +123317,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Badge extends PreactCustomElement implements BadgeProps {\n accessor color: BadgeProps['color'];\n accessor icon: BadgeProps['icon'];\n accessor size: BadgeProps['size'];\n accessor tone: BadgeProps['tone'];\n constructor();\n}" + "value": "declare class Badge extends BadgeBase implements BadgeProps {\n /**\n * The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: BadgeProps['icon'];\n /**\n * The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.\n */\n tone: BadgeProps['tone'];\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "Banner": { "filePath": "src/surfaces/admin/components.ts", "name": "Banner", - "description": "Configure the following properties on the banner component.", - "isPublicDocs": true, + "description": "A custom element for displaying important messages and notifications.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -110040,7 +123363,7 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.", + "description": "The color tone of the banner based on its semantic meaning.", "defaultValue": "'auto'" }, { @@ -110048,7 +123371,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Controls whether the banner is visible or hidden.\n\nWhen using a controlled component pattern and the banner is `dismissible`, update this property to `true` when the `dismiss` event fires.\n\nYou can hide the banner programmatically by setting this to `true` even if it's not `dismissible`.", + "description": "Whether the banner is hidden from view.", "defaultValue": "false" }, { @@ -110056,9 +123379,16 @@ "syntaxKind": "PropertyDeclaration", "name": "dismissible", "value": "boolean", - "description": "Whether the banner displays a close button that allows users to dismiss it.\n\nWhen the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, any animation completes, and the `afterhide` event fires.", + "description": "Whether the banner can be dismissed by the user.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -110104,7 +123434,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -110112,24 +123442,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Banner extends PreactCustomElement implements BannerProps {\n accessor heading: BannerProps['heading'];\n accessor tone: BannerProps['tone'];\n accessor hidden: BannerProps['hidden'];\n accessor dismissible: BannerProps['dismissible'];\n constructor();\n}" + "value": "declare class Banner extends PolarisCustomElement implements BannerProps {\n /**\n * The heading text displayed at the top of the banner.\n */\n heading: BannerProps['heading'];\n /**\n * The color tone of the banner based on its semantic meaning.\n */\n tone: BannerProps['tone'];\n /**\n * Whether the banner is hidden from view.\n */\n hidden: BannerProps['hidden'];\n /**\n * Whether the banner can be dismissed by the user.\n */\n dismissible: BannerProps['dismissible'];\n constructor();\n}" }, "Box": { "filePath": "src/surfaces/admin/components.ts", "name": "Box", - "description": "Configure the following properties on the box component.", - "isPublicDocs": true, + "description": "A box is a container component that provides control over layout, spacing, and styling.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -110137,7 +123481,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -110145,7 +123489,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -110153,7 +123497,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -110161,7 +123505,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -110169,7 +123513,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -110177,7 +123521,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -110185,7 +123529,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -110193,7 +123537,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -110201,7 +123545,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -110209,7 +123553,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -110217,7 +123561,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -110225,7 +123569,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -110233,7 +123577,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -110241,7 +123585,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -110249,7 +123593,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -110257,7 +123601,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -110277,7 +123621,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -110285,7 +123629,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -110293,7 +123637,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -110301,7 +123645,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -110309,14 +123653,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -110324,9 +123668,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -110372,7 +123723,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -110380,8 +123731,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Box extends BoxElement implements BoxProps {\n constructor();\n}" @@ -110390,120 +123756,106 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -110511,60 +123863,60 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "Button": { "filePath": "src/surfaces/admin/components.ts", "name": "Button", - "description": "Configure the following properties on the button component.", - "isPublicDocs": true, + "description": "The button custom element class that renders interactive buttons in the Shopify admin interface. This component triggers actions or navigation when clicked, with customizable visual styles, states, and optional icons.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", - "defaultValue": "false" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier." + "name": "variant", + "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", + "description": "The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.", + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "loading", - "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", - "defaultValue": "false" + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "variant", - "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "defaultValue": "'auto'" + "name": "disabled", + "value": "boolean", + "description": "Whether the button is disabled, preventing any interaction. When `true`, the button appears visually disabled and doesn't respond to user clicks.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" + "name": "loading", + "value": "boolean", + "description": "Whether the button is in a loading state. When `true`, displays a loading indicator and prevents interaction to show that an action is in progress.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to open the linked document when the button acts as a link. Available options: `''`, `'_blank'`, `'_self'`, `'_parent'`, or `'_top'`.", "defaultValue": "'auto'" }, { @@ -110572,21 +123924,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "A URL that the button should navigate to when clicked. When provided, the button behaves as a link." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Prompts the user to save the linked URL as a file with the specified filename. Only works when `href` is provided." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The button's behavior in forms. Available options: `'button'`, `'submit'`, or `'reset'`.", "defaultValue": "'button'" }, { @@ -110594,7 +123946,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the button's purpose for screen readers. This is essential for accessibility when the button doesn't have visible text." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "inlineSize", + "value": "\"auto\" | \"fill\" | \"fit-content\"", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -110641,7 +124008,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -110649,15 +124016,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -110665,38 +124047,36 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Button extends Button_base implements ButtonProps {\n accessor disabled: ButtonProps['disabled'];\n accessor icon: ButtonProps['icon'];\n accessor loading: ButtonProps['loading'];\n accessor variant: ButtonProps['variant'];\n accessor tone: ButtonProps['tone'];\n accessor target: ButtonProps['target'];\n accessor href: ButtonProps['href'];\n accessor download: ButtonProps['download'];\n accessor type: ButtonProps['type'];\n accessor accessibilityLabel: ButtonProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Button\n extends ButtonBase\n implements ButtonProps\n{\n /**\n * The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: ButtonProps['icon'];\n /**\n * The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.\n */\n variant: ButtonProps['variant'];\n /**\n * The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.\n */\n tone: ButtonProps['tone'];\n constructor();\n}" }, "AnyString": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AnyString", "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true + "description": "Prevents widening string literal types in a union to `string`." }, "ButtonGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "ButtonGroup", - "description": "Configure the following properties on the button group component.", - "isPublicDocs": true, + "description": "A button group that arranges multiple buttons together with consistent spacing and semantic grouping for related actions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "\"base\" | \"none\"", - "description": "The spacing between buttons in the group.\n\n- `base`: Standard spacing that provides clear visual separation between buttons.\n- `none`: No spacing, creating a connected button group.", + "description": "The amount of spacing between buttons in the group, affecting the visual separation of actions.", "defaultValue": "'base'" }, { @@ -110704,7 +124084,21 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, describing the purpose of this group of buttons." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -110730,14 +124124,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -110751,7 +124137,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -110759,39 +124145,68 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ButtonGroup\n extends PreactCustomElement\n implements ButtonGroupProps\n{\n accessor gap: ButtonGroupProps['gap'];\n accessor accessibilityLabel: ButtonGroupProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class ButtonGroup extends ButtonGroupBase implements ButtonGroupProps {\n constructor();\n}" }, "Checkbox": { "filePath": "src/surfaces/admin/components.ts", "name": "Checkbox", - "description": "Configure the following properties on the checkbox component.", - "isPublicDocs": true, + "description": "A checkbox that lets users select or deselect an option, with support for an indeterminate state.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "indeterminate", "value": "boolean", - "description": "Whether the checkbox displays in an indeterminate state (neither checked nor unchecked), typically used to indicate partial selection in hierarchical lists.\n\nThis visual state takes priority over the `checked` prop in appearance only. The form submission value is still determined by the `checked` prop.\n\nIf `indeterminate` has not been explicitly set and hasn't been modified by user interaction, it returns the value of `defaultIndeterminate`." + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultIndeterminate", "value": "boolean", - "description": "The initial indeterminate state for uncontrolled components. Use this when you want the checkbox to start in an indeterminate state but don't need to control it afterward.\n\nThis value applies until `indeterminate` is explicitly set or the user changes the checkbox state by clicking.", + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "labelAccessibilityVisibility", + "value": "\"visible\" | \"exclusive\"", + "description": "", + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -110806,7 +124221,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -110814,28 +124229,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -110858,7 +124273,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -110866,23 +124281,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -110928,7 +124350,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -110936,24 +124358,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Checkbox extends PreactCheckboxElement implements CheckboxProps {\n get indeterminate(): CheckboxProps['indeterminate'];\n set indeterminate(indeterminate: CheckboxProps['indeterminate']);\n accessor defaultIndeterminate: CheckboxProps['defaultIndeterminate'];\n constructor();\n}" + "value": "declare class Checkbox extends CheckboxBase implements CheckboxProps {\n constructor();\n}" + }, + "CallbackEvent": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CallbackEvent", + "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." }, "Chip": { "filePath": "src/surfaces/admin/components.ts", "name": "Chip", - "description": "Configure the following properties on the chip component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "Modify the color to be more or less intense.", "defaultValue": "'base'" }, { @@ -110961,7 +124404,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -111008,7 +124466,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -111016,24 +124474,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Chip extends PreactCustomElement implements ChipProps {\n accessor color: ChipProps['color'];\n accessor accessibilityLabel: ChipProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Chip extends PolarisCustomElement implements ChipProps {\n color: ChipProps['color'];\n accessibilityLabel: ChipProps['accessibilityLabel'];\n removable: ChipProps['removable'];\n constructor(renderImpl?: Omit);\n}" }, "Choice": { "filePath": "src/surfaces/admin/components.ts", "name": "Choice", - "description": "The choice component creates individual selectable options within a choice list. Use choice to define each option that merchants can select, supporting both single selection (radio buttons) and multiple selection (checkboxes) modes.\n\nChoice components support labels, help text, and custom content through slots, providing flexible option presentation within choice lists.", - "isPublicDocs": true, + "description": "A single choice within a choice list that can be selected with a radio button or checkbox.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the choice is disabled and can't be selected.", "defaultValue": "false" }, { @@ -111041,7 +124513,7 @@ "syntaxKind": "GetAccessor", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the choice is currently selected.", "defaultValue": "false" }, { @@ -111049,21 +124521,21 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this choice is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, used when the visual label isn't descriptive enough." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the choice should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -111082,6 +124554,13 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -111111,7 +124590,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -111119,24 +124598,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Choice extends PreactCustomElement implements ChoiceProps {\n accessor disabled: ChoiceProps['disabled'];\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n accessor value: ChoiceProps['value'];\n accessor accessibilityLabel: ChoiceProps['accessibilityLabel'];\n accessor defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Choice extends PolarisCustomElement implements ChoiceProps {\n /**\n * Whether the choice is disabled and can't be selected.\n */\n disabled: ChoiceProps['disabled'];\n /**\n * Whether the choice is currently selected.\n */\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n /**\n * The value that's submitted with the form when this choice is selected.\n */\n value: ChoiceProps['value'];\n /**\n * A label that's only visible to screen readers, used when the visual label isn't descriptive enough.\n */\n accessibilityLabel: ChoiceProps['accessibilityLabel'];\n /**\n * Whether the choice should be selected when it's first rendered.\n */\n defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ChoiceList": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceList", - "description": "Configure the following properties on the choice list component.", - "isPublicDocs": true, + "description": "A list of choices that lets users select one or more options using radio buttons or checkboxes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "addEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", + "description": "Wraps change and input event listeners so they only fire when the event was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n\nThis prevents form events from elements inside secondary content (e.g. TextField, native ) from being mistakenly treated as ChoiceList value-change events, while still allowing those events to bubble normally through the DOM (preserving React's event delegation).", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "removeEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction. When `true`, the `disabled` property on any child choices is ignored.", + "description": "Whether all choices in the list are disabled and can't be selected.", "defaultValue": "false" }, { @@ -111144,43 +124653,43 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name that identifies this choice list when the form is submitted." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the choice list when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the choice list." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "multiple", "value": "boolean", - "description": "Whether multiple choices can be selected.", + "description": "Whether users can select more than one choice at a time.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the choice list is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -111188,7 +124697,7 @@ "syntaxKind": "GetAccessor", "name": "values", "value": "string[]", - "description": "An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected." + "description": "The values of the currently selected choices." }, { "filePath": "src/surfaces/admin/components.ts", @@ -111217,11 +124726,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$3@11434", + "name": "__@internals$3@16769", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -111251,7 +124767,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -111259,38 +124775,52 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ChoiceList extends BaseClass$3 implements ChoiceListProps {\n accessor disabled: ChoiceListProps['disabled'];\n accessor name: ChoiceListProps['name'];\n accessor error: ChoiceListProps['error'];\n accessor details: ChoiceListProps['details'];\n accessor multiple: ChoiceListProps['multiple'];\n accessor label: ChoiceListProps['label'];\n accessor labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class ChoiceList extends BaseClass$1 implements ChoiceListProps {\n /**\n * Wraps change and input event listeners so they only fire when the event\n * was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n *\n * This prevents form events from elements inside secondary content (e.g.\n * TextField, native ) from being mistakenly treated as ChoiceList\n * value-change events, while still allowing those events to bubble normally\n * through the DOM (preserving React's event delegation).\n * @private\n */\n addEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n\n /** @private */\n removeEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: EventListenerOptions | boolean,\n ): void;\n\n /**\n * Whether all choices in the list are disabled and can't be selected.\n */\n disabled: ChoiceListProps['disabled'];\n /**\n * The name that identifies this choice list when the form is submitted.\n */\n name: ChoiceListProps['name'];\n /**\n * An error message that's displayed below the choice list when validation fails.\n */\n error: ChoiceListProps['error'];\n /**\n * Additional text to provide context or guidance for the choice list.\n */\n details: ChoiceListProps['details'];\n /**\n * Whether users can select more than one choice at a time.\n */\n multiple: ChoiceListProps['multiple'];\n /**\n * The text that describes what the choice list is for.\n */\n label: ChoiceListProps['label'];\n /**\n * Controls whether the label is visible to all users or only to screen readers.\n */\n labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n /**\n * The values of the currently selected choices.\n */\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "Clickable": { "filePath": "src/surfaces/admin/components.ts", "name": "Clickable", - "description": "Configure the following properties on the clickable component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the component is disabled, preventing clicks and focus. When disabled, the `click` event won't fire and click events from child elements stop propagating immediately. Interactive child elements can still receive focus and be interacted with. This doesn't apply visual styling by default. You shouldapply disabled styling as needed." + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the component is in a loading state, which indicates to assistive technology that an action is in progress and prevents interaction." + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -111298,21 +124828,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "defaultValue": "'button'" }, { @@ -111320,7 +124850,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -111328,7 +124858,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -111336,7 +124866,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -111344,7 +124874,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -111352,7 +124882,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -111360,7 +124890,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -111368,7 +124898,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -111376,7 +124906,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -111384,7 +124914,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -111392,7 +124922,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -111400,7 +124930,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -111408,7 +124938,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -111416,7 +124946,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -111424,7 +124954,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -111432,7 +124962,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -111440,7 +124970,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -111448,7 +124978,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -111468,7 +124998,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -111476,7 +125006,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -111484,7 +125014,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -111492,7 +125022,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -111500,14 +125030,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -111515,9 +125045,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -111563,7 +125100,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -111571,15 +125108,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -111587,30 +125139,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n accessor disabled: ClickableProps['disabled'];\n accessor loading: ClickableProps['loading'];\n accessor target: ClickableProps['target'];\n accessor href: ClickableProps['href'];\n accessor download: ClickableProps['download'];\n accessor type: ClickableProps['type'];\n constructor();\n}" + "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n disabled: ClickableProps['disabled'];\n loading: ClickableProps['loading'];\n target: ClickableProps['target'];\n href: ClickableProps['href'];\n download: ClickableProps['download'];\n type: ClickableProps['type'];\n constructor();\n}" }, "ClickableChip": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChip", - "description": "Configure the following properties on the clickable chip component.", - "isPublicDocs": true, + "description": "A custom element for displaying interactive chips that can be clicked or removed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "The color of the chip.", "defaultValue": "'base'" }, { @@ -111618,14 +125169,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the chip for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "removable", "value": "boolean", - "description": "Whether the chip displays a remove button for dismissal. When clicked, the `remove` callback fires.", + "description": "Whether the chip can be removed by the user.", "defaultValue": "false" }, { @@ -111633,7 +125184,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Whether the chip is hidden from view. When using controlled component pattern with `removable` chips, update this property when the `remove` event fires. For non-removable chips, manually toggle this property to show or hide the chip.", + "description": "Whether the chip is hidden from view.", "defaultValue": "false" }, { @@ -111641,7 +125192,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the chip is disabled, preventing any user interaction.", + "description": "Whether the chip is disabled and can't be clicked.", "defaultValue": "false" }, { @@ -111649,7 +125200,14 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to navigate to when the chip is clicked." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -111696,7 +125254,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -111704,15 +125262,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -111720,30 +125293,29 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class ClickableChip\n extends ClickableChip_base\n implements ClickableChipProps\n{\n accessor color: ClickableChipProps['color'];\n accessor accessibilityLabel: ClickableChipProps['accessibilityLabel'];\n accessor removable: ClickableChipProps['removable'];\n accessor hidden: ClickableChipProps['hidden'];\n accessor disabled: ClickableChipProps['disabled'];\n accessor href: ClickableChipProps['href'];\n constructor();\n}" + "value": "declare class ClickableChip\n extends ClickableChipBase\n implements ClickableChipProps\n{\n /**\n * The color of the chip.\n */\n color: ClickableChipProps['color'];\n constructor();\n}" }, "ColorField": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorField", - "description": "Configure the following properties on the color field component.", - "isPublicDocs": true, + "description": "The color field custom element class that renders a color input field with integrated visual picker in the Shopify admin interface. This component allows merchants to select colors by typing hex values or using an interactive color picker, with optional support for transparency (alpha channel).", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -111751,7 +125323,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", @@ -111774,7 +125346,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\"", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -111782,35 +125354,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -111818,14 +125390,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -111833,7 +125405,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -111857,7 +125429,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -111873,7 +125445,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -111881,23 +125453,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -111935,7 +125514,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -111943,24 +125522,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ColorField\n extends PreactFieldElement\n implements ColorFieldProps\n{\n accessor alpha: ColorFieldProps['alpha'];\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n setInternalValue(value: string, normalize: boolean): void;\n}" + "value": "declare class ColorField extends ColorFieldBase implements ColorFieldProps {\n constructor();\n}" }, "ColorPicker": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorPicker", - "description": "Configure the following properties on the color picker component.", - "isPublicDocs": true, + "description": "A visual color picker component that allows users to select colors from a color spectrum interface.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -111968,154 +125561,138 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial color value when the field first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts interacting, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", "name": "formResetCallback", "value": "() => void", - "description": "A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@internals$2@11535", - "value": "ElementInternals", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", "description": "", "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true } ], - "value": "declare class ColorPicker extends BaseClass$2 implements ColorPickerProps {\n accessor alpha: boolean;\n accessor name: string;\n accessor defaultValue: string;\n get value(): string;\n set value(value: string);\n /**\n * A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`.\n */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class ColorPicker extends BaseClass implements ColorPickerProps {\n /**\n * Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.\n *\n * @default false\n */\n alpha: boolean;\n /**\n * The name of the picker, used when submitting form data.\n */\n name: string;\n /**\n * The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n defaultValue: string;\n /**\n * The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n}" }, "DateField": { "filePath": "src/surfaces/admin/components.ts", "name": "DateField", - "description": "Configure the following properties on the date field component.", - "isPublicDocs": true, + "description": "The date field custom element class that renders a date input field with integrated calendar picker in the Shopify admin interface. This component allows merchants to select dates by typing or using a visual calendar, with support for date range restrictions and day-of-week constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar picker, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar picker first opens, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "DateAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -112123,36 +125700,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "defaultValue": "\"\"" + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -112160,14 +125736,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -112175,7 +125751,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -112199,7 +125775,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -112223,7 +125799,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -112231,31 +125807,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected date in `YYYY-MM-DD` format. An empty string means no date is selected.", - "defaultValue": "\"\"" + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -112293,7 +125875,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -112301,78 +125883,139 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DateField\n extends PreactFieldElement\n implements DateFieldProps\n{\n accessor allow: DateFieldProps['allow'];\n accessor disallow: DateFieldProps['disallow'];\n accessor allowDays: DateFieldProps['allowDays'];\n accessor disallowDays: DateFieldProps['disallowDays'];\n set view(view: string);\n get view(): string;\n accessor defaultView: DateFieldProps['defaultView'];\n constructor();\n}" + "value": "declare class DateField extends DateFieldBase implements DateFieldProps {\n constructor();\n}" }, "DateAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "DateAutocompleteField", "value": "'bday-day' | 'bday-month' | 'bday-year' | 'bday' | 'cc-expiry-month' | 'cc-expiry-year' | 'cc-expiry'", - "description": "Represents autocomplete values that are valid for date input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for date-based inputs.\n\nAvailable values:\n- `bday` - Complete birthday date\n- `bday-day` - Day component of a birthday (1-31)\n- `bday-month` - Month component of a birthday (1-12)\n- `bday-year` - Year component of a birthday (1990)\n- `cc-expiry` - Complete credit card expiration date\n- `cc-expiry-month` - Month component of a credit card expiration date (1-12)\n- `cc-expiry-year` - Year component of a credit card expiration date (2025)", - "isPublicDocs": true + "description": "" }, "DatePicker": { "filePath": "src/surfaces/admin/components.ts", "name": "DatePicker", - "description": "Configure the following properties on the date picker component.", - "isPublicDocs": true, + "description": "The date picker custom element class that renders a standalone calendar interface in the Shopify admin. This component allows merchants to select single dates or date ranges using an interactive calendar with month/year navigation, date constraints, and day-of-week restrictions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar first renders, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"single\" | \"range\"", - "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "description": "The type of date selection allowed. Available values: `single`, `range`.", "defaultValue": "\"single\"" }, { @@ -112380,7 +126023,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initially selected date(s) when the component first renders. An empty string means no date is initially selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The initial selected date or date range when the picker first renders, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -112388,14 +126031,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "value", "value": "string", - "description": "The currently selected date(s). An empty string means no date is selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The currently selected date or date range, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -112409,19 +126052,26 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@dirtyStateSymbol@11579", - "value": "boolean", + "name": "__@internals$1@16931", + "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$1@11578", - "value": "ElementInternals", + "name": "__@dirtyStateSymbol@16932", + "value": "boolean", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -112467,7 +126117,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -112475,17 +126125,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DatePicker extends BaseClass$1 implements DatePickerProps {\n accessor defaultView: string;\n set view(view: string);\n get view(): string;\n accessor allow: DatePickerProps['allow'];\n accessor disallow: DatePickerProps['disallow'];\n accessor allowDays: DatePickerProps['allowDays'];\n accessor disallowDays: DatePickerProps['disallowDays'];\n accessor type: DatePickerProps['type'];\n accessor defaultValue: DatePickerProps['defaultValue'];\n accessor name: DatePickerProps['name'];\n set value(value: string);\n get value(): string;\n /** @private */\n [dirtyStateSymbol]: boolean;\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DatePicker\n extends DatePickerBase\n implements DatePickerProps\n{\n constructor();\n}" }, "DropZone": { "filePath": "src/surfaces/admin/components.ts", "name": "DropZone", - "description": "Configure the following properties on the drop zone component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -112507,29 +126171,29 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -112545,14 +126209,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -112582,7 +126246,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@setFiles@11614", + "name": "__@setFiles@16968", "value": "(files: File[]) => void", "description": "", "isPrivate": true @@ -112590,7 +126254,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@getFileInput@11616", + "name": "__@getFileInput@16970", "value": "() => HTMLInputElement", "description": "", "isPrivate": true @@ -112598,11 +126262,120 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals@11615", + "name": "__@internals@16969", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class DropZone extends DropZoneBase implements DropZoneProps {\n constructor();\n}" + }, + "Divider": { + "filePath": "src/surfaces/admin/components.ts", + "name": "Divider", + "description": "A divider is a visual separator that creates a line between different sections of content.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "direction", + "value": "\"inline\" | \"block\"", + "description": "The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n\n- `inline`: Horizontal divider for separating vertically stacked content\n- `block`: Vertical divider for separating horizontally arranged content", + "defaultValue": "'inline'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"strong\"", + "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -112648,7 +126421,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -112656,113 +126429,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class DropZone extends BaseClass implements DropZoneProps {\n accessor accept: DropZoneProps['accept'];\n accessor accessibilityLabel: DropZoneProps['accessibilityLabel'];\n accessor disabled: DropZoneProps['disabled'];\n accessor error: DropZoneProps['error'];\n accessor label: DropZoneProps['label'];\n accessor labelAccessibilityVisibility: DropZoneProps['labelAccessibilityVisibility'];\n accessor multiple: DropZoneProps['multiple'];\n accessor name: DropZoneProps['name'];\n accessor required: DropZoneProps['required'];\n get value(): string;\n /** This sets the input value for a file type, which cannot be set programatically, so it can only be reset. */\n set value(value: '' | null);\n get files(): File[];\n set files(files: File[]);\n /** @private */\n [setFiles](files: File[]): void;\n /** @private */\n [getFileInput](): ReplaceType<\n Element | null | undefined,\n Element,\n HTMLInputElement\n >;\n\n /** @private */\n formResetCallback(): void;\n constructor();\n}" - }, - "Divider": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Divider", - "description": "Configure the following properties on the divider component.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "direction", - "value": "\"inline\" | \"block\"", - "description": "The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n\n- `inline`: Horizontal divider for separating vertically stacked content\n- `block`: Vertical divider for separating horizontally arranged content", - "defaultValue": "'inline'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"strong\"", - "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", - "defaultValue": "'base'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", + "name": "__@flushRenderSymbol@16092", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Divider extends PreactCustomElement implements DividerProps {\n accessor direction: DividerProps['direction'];\n accessor color: DividerProps['color'];\n constructor();\n}" + "value": "declare class Divider extends PolarisCustomElement implements DividerProps {\n /**\n * The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n *\n * - `inline`: Horizontal divider for separating vertically stacked content\n * - `block`: Vertical divider for separating horizontally arranged content\n *\n * @default 'inline'\n */\n direction: DividerProps['direction'];\n /**\n * The visual prominence of the divider line.\n *\n * - `base`: Standard divider for most separations (default)\n * - `strong`: More prominent divider for major section breaks\n *\n * @default 'base'\n */\n color: DividerProps['color'];\n constructor();\n}" }, "EmailField": { "filePath": "src/surfaces/admin/components.ts", "name": "EmailField", - "description": "Configure the following properties on the email field component.", - "isPublicDocs": true, + "description": "The email field custom element class that renders an email input field in the Shopify admin interface. This component allows merchants to enter email addresses with automatic validation and optimized mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | EmailAutocompleteField | `section-${string} email` | `section-${string} home email` | `section-${string} mobile email` | `section-${string} fax email` | `section-${string} pager email` | \"shipping email\" | \"shipping home email\" | \"shipping mobile email\" | \"shipping fax email\" | \"shipping pager email\" | \"billing email\" | \"billing home email\" | \"billing mobile email\" | \"billing fax email\" | \"billing pager email\" | `section-${string} shipping email` | `section-${string} shipping home email` | `section-${string} shipping mobile email` | `section-${string} shipping fax email` | `section-${string} shipping pager email` | `section-${string} billing email` | `section-${string} billing home email` | `section-${string} billing mobile email` | `section-${string} billing fax email` | `section-${string} billing pager email`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint as to the intended content of the field for autocomplete purposes.", + "defaultValue": "'email'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -112770,50 +126476,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -112821,14 +126520,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -112836,7 +126535,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -112860,7 +126559,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -112884,7 +126583,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -112892,23 +126591,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -112946,7 +126659,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -112954,32 +126667,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class EmailField\n extends PreactFieldElement\n implements EmailFieldProps\n{\n accessor autocomplete: EmailFieldProps['autocomplete'];\n accessor maxLength: EmailFieldProps['maxLength'];\n accessor minLength: EmailFieldProps['minLength'];\n /**\n * The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class EmailField extends EmailFieldBase implements EmailFieldProps {\n constructor();\n}" }, "EmailAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "EmailAutocompleteField", "value": "'email' | 'home email' | 'mobile email' | 'fax email' | 'pager email'", - "description": "Represents autocomplete values that are valid for email input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for email inputs.\n\nAvailable values:\n- `email` - Primary email address\n- `home email` - Home email address\n- `mobile email` - Mobile device email address\n- `fax email` - Fax machine email address\n- `pager email` - Pager device email address", - "isPublicDocs": true + "description": "" }, "Grid": { "filePath": "src/surfaces/admin/components.ts", "name": "Grid", - "description": "Configure the following properties on the grid component.", - "isPublicDocs": true, + "description": "A grid is a layout component that arranges its children in rows and columns with precise control over sizing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridTemplateColumns", "value": "string", - "description": "The columns in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid columns.", "defaultValue": "'none'" }, { @@ -112987,7 +126713,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridTemplateRows", "value": "string", - "description": "The rows in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid rows.", "defaultValue": "'none'" }, { @@ -112995,7 +126721,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyItems", "value": "\"\" | JustifyItemsKeyword", - "description": "Aligns the grid items along the inline axis.", + "description": "The alignment of grid items along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -113003,7 +126729,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "\"\" | AlignItemsKeyword", - "description": "Aligns the grid items along the block axis.", + "description": "The alignment of grid items along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -113011,7 +126737,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeItems", "value": "AlignItemsKeyword | \"normal normal\" | \"normal stretch\" | \"normal baseline\" | \"normal first baseline\" | \"normal last baseline\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch baseline\" | \"stretch first baseline\" | \"stretch last baseline\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline baseline\" | \"baseline first baseline\" | \"baseline last baseline\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline baseline\" | \"first baseline first baseline\" | \"first baseline last baseline\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline baseline\" | \"last baseline first baseline\" | \"last baseline last baseline\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start baseline\" | \"start first baseline\" | \"start last baseline\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end baseline\" | \"end first baseline\" | \"end last baseline\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center baseline\" | \"center first baseline\" | \"center last baseline\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start baseline\" | \"unsafe start first baseline\" | \"unsafe start last baseline\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end baseline\" | \"unsafe end first baseline\" | \"unsafe end last baseline\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center baseline\" | \"unsafe center first baseline\" | \"unsafe center last baseline\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start baseline\" | \"safe start first baseline\" | \"safe start last baseline\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end baseline\" | \"safe end first baseline\" | \"safe end last baseline\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center baseline\" | \"safe center first baseline\" | \"safe center last baseline\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\"", - "description": "A shorthand property for `justify-items` and `align-items`.", + "description": "A shorthand for setting both `alignItems` and `justifyItems`.", "defaultValue": "'normal normal'" }, { @@ -113019,7 +126745,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "\"\" | JustifyContentKeyword", - "description": "Aligns the grid along the inline axis. This overrides the inline value of `placeContent`.", + "description": "The alignment of the grid along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -113027,7 +126753,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "\"\" | AlignContentKeyword", - "description": "Aligns the grid along the block axis. This overrides the block value of `placeContent`.", + "description": "The alignment of the grid along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -113035,7 +126761,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeContent", "value": "\"normal normal\" | \"normal stretch\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\" | AlignContentKeyword | \"normal space-between\" | \"normal space-around\" | \"normal space-evenly\" | \"baseline space-between\" | \"baseline space-around\" | \"baseline space-evenly\" | \"first baseline space-between\" | \"first baseline space-around\" | \"first baseline space-evenly\" | \"last baseline space-between\" | \"last baseline space-around\" | \"last baseline space-evenly\" | \"start space-between\" | \"start space-around\" | \"start space-evenly\" | \"end space-between\" | \"end space-around\" | \"end space-evenly\" | \"center space-between\" | \"center space-around\" | \"center space-evenly\" | \"unsafe start space-between\" | \"unsafe start space-around\" | \"unsafe start space-evenly\" | \"unsafe end space-between\" | \"unsafe end space-around\" | \"unsafe end space-evenly\" | \"unsafe center space-between\" | \"unsafe center space-around\" | \"unsafe center space-evenly\" | \"safe start space-between\" | \"safe start space-around\" | \"safe start space-evenly\" | \"safe end space-between\" | \"safe end space-around\" | \"safe end space-evenly\" | \"safe center space-between\" | \"safe center space-around\" | \"safe center space-evenly\" | \"stretch space-between\" | \"stretch space-around\" | \"stretch space-evenly\" | \"space-between normal\" | \"space-between start\" | \"space-between end\" | \"space-between center\" | \"space-between unsafe start\" | \"space-between unsafe end\" | \"space-between unsafe center\" | \"space-between safe start\" | \"space-between safe end\" | \"space-between safe center\" | \"space-between stretch\" | \"space-between space-between\" | \"space-between space-around\" | \"space-between space-evenly\" | \"space-around normal\" | \"space-around start\" | \"space-around end\" | \"space-around center\" | \"space-around unsafe start\" | \"space-around unsafe end\" | \"space-around unsafe center\" | \"space-around safe start\" | \"space-around safe end\" | \"space-around safe center\" | \"space-around stretch\" | \"space-around space-between\" | \"space-around space-around\" | \"space-around space-evenly\" | \"space-evenly normal\" | \"space-evenly start\" | \"space-evenly end\" | \"space-evenly center\" | \"space-evenly unsafe start\" | \"space-evenly unsafe end\" | \"space-evenly unsafe center\" | \"space-evenly safe start\" | \"space-evenly safe end\" | \"space-evenly safe center\" | \"space-evenly stretch\" | \"space-evenly space-between\" | \"space-evenly space-around\" | \"space-evenly space-evenly\"", - "description": "A shorthand property for `justify-content` and `align-content`.", + "description": "A shorthand for setting both `alignContent` and `justifyContent`.", "defaultValue": "'normal normal'" }, { @@ -113043,7 +126769,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows and columns.", "defaultValue": "'none'" }, { @@ -113051,7 +126777,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "s spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows.", "defaultValue": "'' - meaning no override" }, { @@ -113059,7 +126785,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid columns.", "defaultValue": "'' - meaning no override" }, { @@ -113067,7 +126793,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -113075,7 +126801,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -113083,7 +126809,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -113091,7 +126817,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -113099,7 +126825,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -113107,7 +126833,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -113115,7 +126841,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -113123,7 +126849,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -113131,7 +126857,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -113139,7 +126865,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -113147,7 +126873,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -113155,7 +126881,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -113163,7 +126889,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -113171,7 +126897,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -113179,7 +126905,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -113187,7 +126913,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -113195,7 +126921,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -113215,7 +126941,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -113223,7 +126949,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -113231,7 +126957,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -113239,7 +126965,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -113247,14 +126973,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -113262,9 +126988,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -113310,7 +127043,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -113318,96 +127051,101 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n accessor gridTemplateColumns: GridProps['gridTemplateColumns'];\n accessor gridTemplateRows: GridProps['gridTemplateRows'];\n accessor justifyItems: GridProps['justifyItems'];\n accessor alignItems: GridProps['alignItems'];\n accessor placeItems: GridProps['placeItems'];\n accessor justifyContent: GridProps['justifyContent'];\n accessor alignContent: GridProps['alignContent'];\n accessor placeContent: GridProps['placeContent'];\n accessor gap: GridProps['gap'];\n accessor rowGap: GridProps['rowGap'];\n accessor columnGap: GridProps['columnGap'];\n}" + "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n /**\n * The template that defines the grid columns.\n */\n gridTemplateColumns: GridProps['gridTemplateColumns'];\n /**\n * The template that defines the grid rows.\n */\n gridTemplateRows: GridProps['gridTemplateRows'];\n /**\n * The alignment of grid items along the inline axis.\n */\n justifyItems: GridProps['justifyItems'];\n /**\n * The alignment of grid items along the block axis.\n */\n alignItems: GridProps['alignItems'];\n /**\n * A shorthand for setting both `alignItems` and `justifyItems`.\n */\n placeItems: GridProps['placeItems'];\n /**\n * The alignment of the grid along the inline axis.\n */\n justifyContent: GridProps['justifyContent'];\n /**\n * The alignment of the grid along the block axis.\n */\n alignContent: GridProps['alignContent'];\n /**\n * A shorthand for setting both `alignContent` and `justifyContent`.\n */\n placeContent: GridProps['placeContent'];\n /**\n * The spacing between grid rows and columns.\n */\n gap: GridProps['gap'];\n /**\n * The spacing between grid rows.\n */\n rowGap: GridProps['rowGap'];\n /**\n * The spacing between grid columns.\n */\n columnGap: GridProps['columnGap'];\n}" }, "JustifyItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.\n\nLearn more about the [justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).", - "isPublicDocs": true + "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis." }, "BaselinePosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BaselinePosition", "value": "'baseline' | 'first baseline' | 'last baseline'", - "description": "Represents baseline alignment positions used to align items relative to their baselines.\n- `baseline`: Aligns to the baseline of the parent.\n- `first baseline`: Aligns to the first baseline of the parent.\n- `last baseline`: Aligns to the last baseline of the parent.", - "isPublicDocs": true + "description": "" }, "OverflowPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "OverflowPosition", "value": "`unsafe ${ContentPosition}` | `safe ${ContentPosition}`", - "description": "Represents content positioning with overflow behavior control. Use `safe` to prevent content from becoming inaccessible when it overflows, or `unsafe` to allow overflow regardless of accessibility.", - "isPublicDocs": true + "description": "" }, "ContentPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentPosition", "value": "'center' | 'start' | 'end'", - "description": "Defines the position of content along an axis.\n- `center`: Centers the content.\n- `start`: Aligns content to the start.\n- `end`: Aligns content to the end.", - "isPublicDocs": true + "description": "" }, "AlignItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Align items sets the align-self value on all direct children as a group.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isPublicDocs": true + "description": "Align items sets the align-self value on all direct children as a group." }, "JustifyContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyContentKeyword", "value": "'normal' | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", - "isPublicDocs": true + "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container." }, "ContentDistribution": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentDistribution", "value": "'space-between' | 'space-around' | 'space-evenly' | 'stretch'", - "description": "Defines how space is distributed between and around content items in flex and grid layouts.\n- `space-between`: Distributes items evenly with the first item at the start and last at the end.\n- `space-around`: Distributes items evenly with equal space around each item.\n- `space-evenly`: Distributes items evenly with equal space between them.\n- `stretch`: Stretches items to fill the container.", - "isPublicDocs": true + "description": "" }, "AlignContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignContentKeyword", "value": "'normal' | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isPublicDocs": true + "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis." }, "SpacingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SpacingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the spacing size between elements, using the standard size scale or `none` for no spacing.", - "isPublicDocs": true + "description": "" }, "GridItem": { "filePath": "src/surfaces/admin/components.ts", "name": "GridItem", - "description": "The grid item component represents a single cell within a grid layout, allowing you to control how content is positioned and sized within the grid. Use grid item as a child of grid to specify column span, row span, and positioning for individual content areas.\n\nGrid item supports precise placement control through column and row properties, enabling you to create complex layouts where different items occupy varying amounts of space or appear in specific grid positions.", - "isPublicDocs": true, + "description": "A grid item is a child of a grid that can be positioned within specific rows and columns.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridColumn", "value": "\"auto\" | `span ${number}`", - "description": "The number of columns the item will span across.\n\nLearn more about the [grid-column property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).", + "description": "The column position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -113415,7 +127153,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridRow", "value": "\"auto\" | `span ${number}`", - "description": "The number of rows the item will span across.\n\nLearn more about the [grid-row property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).", + "description": "The row position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -113423,7 +127161,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -113431,7 +127169,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -113439,7 +127177,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -113447,7 +127185,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -113455,7 +127193,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -113463,7 +127201,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -113471,7 +127209,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -113479,7 +127217,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -113487,7 +127225,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -113495,7 +127233,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -113503,7 +127241,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -113511,7 +127249,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -113519,7 +127257,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -113527,7 +127265,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -113535,7 +127273,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -113543,7 +127281,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -113551,7 +127289,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -113571,7 +127309,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -113579,7 +127317,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -113587,7 +127325,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -113595,7 +127333,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -113603,14 +127341,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -113618,9 +127356,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -113666,7 +127411,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -113674,24 +127419,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class GridItem extends BoxElement implements GridItemProps {\n accessor gridColumn: GridItemProps['gridColumn'];\n accessor gridRow: GridItemProps['gridRow'];\n constructor();\n}" + "value": "declare class GridItem extends BoxElement implements GridItemProps {\n /**\n * The column position and span of the grid item.\n */\n gridColumn: GridItemProps['gridColumn'];\n /**\n * The row position and span of the grid item.\n */\n gridRow: GridItemProps['gridRow'];\n constructor();\n}" }, "Heading": { "filePath": "src/surfaces/admin/components.ts", "name": "Heading", - "description": "Configure the following properties on the heading component.", - "isPublicDocs": true, + "description": "A custom element for displaying hierarchical section titles and headings with appropriate semantic meaning and visual styling. Use Heading to structure your content with proper heading levels for both visual hierarchy and accessibility.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"heading\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The ARIA role for the heading. Set to `'heading'` (the default) for standard heading semantics, or `'presentation'` / `'none'` to remove heading semantics for decorative use.", "defaultValue": "'heading'" }, { @@ -113699,7 +127458,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lineClamp", "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", "defaultValue": "Infinity - no truncation is applied" }, { @@ -113707,9 +127466,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -113755,7 +127521,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -113763,47 +127529,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Heading extends PreactCustomElement implements HeadingProps {\n accessor accessibilityRole: HeadingProps['accessibilityRole'];\n accessor lineClamp: HeadingProps['lineClamp'];\n accessor accessibilityVisibility: HeadingProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Heading extends HeadingBase implements HeadingProps {\n constructor();\n}" }, "Icon": { "filePath": "src/surfaces/admin/components.ts", "name": "Icon", - "description": "Configure the following properties on the icon component.", - "isPublicDocs": true, + "description": "An icon displays a graphical symbol from the icon library.", "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", + "description": "The color tone of the icon based on its semantic meaning.", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "The icon to display from the icon library.\n\nSet to a valid icon name to display that icon. To hide the icon completely, use an empty string `''`. To reserve the icon's space without displaying an icon, use `'empty'`." + "value": "\"\" | IconType", + "description": "The type of icon to display." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color emphasis of the icon.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"base\"", - "description": "The size of the icon.\n\n- `small`: Smaller icon suitable for inline use within text or compact UI elements.\n- `base`: Default size that works well for standalone icons and standard use cases.", + "description": "The size of the icon.", "defaultValue": "'base'" }, { @@ -113811,7 +127591,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The element that this icon should show interest for when activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -113858,7 +127645,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -113866,53 +127653,67 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Icon extends PreactCustomElement implements IconProps {\n accessor color: IconProps['color'];\n accessor tone: IconProps['tone'];\n accessor type: IconProps['type'];\n accessor size: IconProps['size'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Icon extends IconBase implements IconProps {\n /**\n * The color tone of the icon based on its semantic meaning.\n */\n tone: IconProps['tone'];\n /**\n * The type of icon to display.\n */\n type: IconProps['type'];\n constructor();\n}" }, "Image": { "filePath": "src/surfaces/admin/components.ts", "name": "Image", - "description": "Configure the following properties on the image component.", - "isPublicDocs": true, + "description": "An image displays pictures with configurable sizing, loading behavior, and borders.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "srcSet", "value": "string", - "description": "A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n\nLearn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset)." + "description": "A set of source images with different sizes for responsive loading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "sizes", "value": "string", - "description": "A set of media conditions and their corresponding sizes.\n\nLearn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes)." + "description": "The sizes of the image at different viewport widths." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "aspectRatio", "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", - "description": "The aspect ratio of the image.\n\nThe rendering of the image will depend on the `inlineSize` value:\n\n- `inlineSize=\"fill\"`: the aspect ratio will be respected and the image will take the necessary space.\n- `inlineSize=\"auto\"`: the image will not render until it has loaded and the aspect ratio will be ignored.\n\nFor example, if the value is set as `50 / 100`, the getter returns `50 / 100`. If the value is set as `0.5`, the getter returns `0.5 / 1`.\n\nLearn more about the [aspect-ratio property](https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio).", + "description": "The aspect ratio of the image as a width-to-height ratio.", "defaultValue": "'1/1'" }, { @@ -113920,7 +127721,7 @@ "syntaxKind": "PropertyDeclaration", "name": "objectFit", "value": "\"contain\" | \"cover\"", - "description": "The image resizing behavior to fit within its container.\n\n- `contain`: Scales the image to fit within the container while maintaining its aspect ratio. The entire image is visible, but might leave empty space.\n- `cover`: Scales the image to fill the entire container while maintaining its aspect ratio. The image might be cropped to fit.\n\nThe image is always positioned in the center of the container.\n\nLearn more about the [object-fit property](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).", + "description": "How the image should be resized to fit its container.", "defaultValue": "'contain'" }, { @@ -113928,7 +127729,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "\"eager\" | \"lazy\"", - "description": "The loading strategy for the image.\n\n- `eager`: Immediately loads the image, irrespective of its position within the visible viewport.\n- `lazy`: Delays loading the image until it approaches a specified distance from the viewport.\n\nLearn more about the [loading attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading).", + "description": "When the image should be loaded.", "defaultValue": "'eager'" }, { @@ -113936,7 +127737,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"img\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The accessibility role for the image.", "defaultValue": "'img'" }, { @@ -113944,7 +127745,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "\"auto\" | \"fill\"", - "description": "The displayed inline width of the image.\n\n- `fill`: the image will takes up 100% of the available inline size.\n- `auto`: the image will be displayed at its natural size.\n\nLearn more about the [width attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#width).", + "description": "The inline size (width in horizontal writing modes) of the image.", "defaultValue": "'fill'" }, { @@ -113952,35 +127753,23 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied around the image using shorthand syntax to specify width, color, and style in a single property.", - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "description": "Whether to show a border around the image.", + "defaultValue": "'none' - equivalent to `none base auto`." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderWidth", - "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderStyle", - "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image.", "defaultValue": "'' - meaning no override" }, { @@ -113988,17 +127777,24 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "The color of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the image's corners using the design system's radius scale.", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image.", "defaultValue": "'none'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -114044,7 +127840,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -114052,24 +127848,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Image extends PreactCustomElement implements ImageProps {\n accessor src: ImageProps['src'];\n accessor srcSet: ImageProps['srcSet'];\n accessor sizes: ImageProps['sizes'];\n accessor alt: ImageProps['alt'];\n accessor aspectRatio: ImageProps['aspectRatio'];\n accessor objectFit: ImageProps['objectFit'];\n accessor loading: ImageProps['loading'];\n accessor accessibilityRole: ImageProps['accessibilityRole'];\n accessor inlineSize: ImageProps['inlineSize'];\n /**\n * A border applied around the image using shorthand syntax to specify width, color, and style in a single property.\n */\n accessor border: ImageProps['border'];\n /**\n * The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.\n */\n accessor borderWidth: ImageProps['borderWidth'];\n /**\n * The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.\n */\n accessor borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.\n */\n accessor borderColor: ImageProps['borderColor'];\n /**\n * The roundedness of the image's corners using the design system's radius scale.\n */\n accessor borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + "value": "declare class Image extends PolarisCustomElement implements ImageProps {\n /**\n * The URL of the image to display.\n */\n src: ImageProps['src'];\n /**\n * A set of source images with different sizes for responsive loading.\n */\n srcSet: ImageProps['srcSet'];\n /**\n * The sizes of the image at different viewport widths.\n */\n sizes: ImageProps['sizes'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ImageProps['alt'];\n /**\n * The aspect ratio of the image as a width-to-height ratio.\n */\n aspectRatio: ImageProps['aspectRatio'];\n /**\n * How the image should be resized to fit its container.\n */\n objectFit: ImageProps['objectFit'];\n /**\n * When the image should be loaded.\n */\n loading: ImageProps['loading'];\n /**\n * The accessibility role for the image.\n */\n accessibilityRole: ImageProps['accessibilityRole'];\n /**\n * The inline size (width in horizontal writing modes) of the image.\n */\n inlineSize: ImageProps['inlineSize'];\n /**\n * Whether to show a border around the image.\n */\n border: ImageProps['border'];\n /**\n * The width of the border around the image.\n */\n borderWidth: ImageProps['borderWidth'];\n /**\n * The style of the border around the image.\n */\n borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image.\n */\n borderColor: ImageProps['borderColor'];\n /**\n * The radius of the border corners around the image.\n */\n borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + }, + "BorderRadiusKeyword": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "BorderRadiusKeyword", + "value": "SizeKeyword | 'max' | 'none'", + "description": "" }, "Link": { "filePath": "src/surfaces/admin/components.ts", "name": "Link", - "description": "Configure the following properties on the link component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", "defaultValue": "'auto'" }, { @@ -114077,21 +127894,21 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -114099,14 +127916,21 @@ "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "lang", "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)." + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -114153,7 +127977,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -114161,15 +127985,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -114177,24 +128016,30 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Link extends Link_base implements LinkProps {\n accessor tone: LinkProps['tone'];\n accessor accessibilityLabel: LinkProps['accessibilityLabel'];\n accessor href: LinkProps['href'];\n accessor target: LinkProps['target'];\n accessor download: LinkProps['download'];\n accessor lang: LinkProps['lang'];\n constructor();\n}" + "value": "declare class Link extends LinkBase implements LinkProps {\n tone: LinkProps['tone'];\n constructor();\n}" }, "ListItem": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItem", - "description": "The list item component represents a single entry within an ordered list or unordered list. Use list item to structure individual points, steps, or items within a list, with each item automatically receiving appropriate list markers (bullets or numbers) from its parent list.\n\nList item must be used as a direct child of ordered list or unordered list components. Each list item can contain text, inline formatting, or other components to create rich list content.", - "isPublicDocs": true, + "description": "A component that represents a single item within an ordered list or unordered list.\n\nUse list item as a child of ordered list or unordered list to create properly structured and accessible list content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -114240,7 +128085,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -114248,24 +128093,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ListItem extends PreactCustomElement implements ListItemProps {\n constructor();\n}" + "value": "declare class ListItem extends PolarisCustomElement implements ListItemProps {\n constructor();\n}" }, "Menu": { "filePath": "src/surfaces/admin/components.ts", "name": "Menu", - "description": "Configure the following properties on the menu component.", - "isPublicDocs": true, + "description": "A component that displays a contextual list of actions or options, which is typically triggered by a button or other activator element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the menu for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", @@ -114286,7 +128145,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -114294,7 +128153,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -114302,11 +128161,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -114336,7 +128202,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -114344,24 +128210,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n accessor accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n /**\n * A label that describes the menu for assistive technologies.\n */\n accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "MoneyField": { "filePath": "src/surfaces/admin/components.ts", "name": "MoneyField", - "description": "Configure the following properties on the money field component.", - "isPublicDocs": true, + "description": "The money field custom element class that renders a monetary input field in the Shopify admin interface. This component allows merchants to enter currency amounts with automatic formatting, decimal precision, and validation against minimum and maximum values.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum monetary value allowed in the field.", "defaultValue": "Infinity" }, { @@ -114369,9 +128249,17 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum monetary value allowed in the field.", "defaultValue": "-Infinity" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "currencyCode", + "value": "\"auto\" | CurrencyCode", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -114384,7 +128272,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "string", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -114392,35 +128280,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -114428,14 +128316,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -114443,7 +128331,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -114467,7 +128355,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -114491,7 +128379,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -114499,23 +128387,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -114553,7 +128448,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -114561,17 +128456,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class MoneyField\n extends PreactFieldElement\n implements MoneyFieldProps\n{\n accessor max: MoneyFieldProps['max'];\n accessor min: MoneyFieldProps['min'];\n /**\n * The current monetary value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string representing the amount in the store's currency.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class MoneyField extends MoneyFieldBase implements MoneyFieldProps {\n constructor();\n}" + }, + "CurrencyCode": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CurrencyCode", + "value": "'USD' | 'EUR' | 'GBP' | 'CAD' | 'AFN' | 'ALL' | 'DZD' | 'AOA' | 'ARS' | 'AMD' | 'AWG' | 'AUD' | 'BBD' | 'AZN' | 'BDT' | 'BSD' | 'BHD' | 'BIF' | 'BZD' | 'BMD' | 'BTN' | 'BAM' | 'BRL' | 'BOB' | 'BWP' | 'BND' | 'BGN' | 'MMK' | 'KHR' | 'CVE' | 'KYD' | 'XAF' | 'CLP' | 'CNY' | 'COP' | 'KMF' | 'CDF' | 'CRC' | 'HRK' | 'CZK' | 'DKK' | 'DOP' | 'XCD' | 'EGP' | 'ETB' | 'XPF' | 'FJD' | 'GMD' | 'GHS' | 'GTQ' | 'GYD' | 'GEL' | 'HTG' | 'HNL' | 'HKD' | 'HUF' | 'ISK' | 'INR' | 'IDR' | 'ILS' | 'IQD' | 'JMD' | 'JPY' | 'JEP' | 'JOD' | 'KZT' | 'KES' | 'KWD' | 'KGS' | 'LAK' | 'LVL' | 'LBP' | 'LSL' | 'LRD' | 'LTL' | 'MGA' | 'MKD' | 'MOP' | 'MWK' | 'MVR' | 'MXN' | 'MYR' | 'MUR' | 'MDL' | 'MAD' | 'MNT' | 'MZN' | 'NAD' | 'NPR' | 'ANG' | 'NZD' | 'NIO' | 'NGN' | 'NOK' | 'OMR' | 'PAB' | 'PKR' | 'PGK' | 'PYG' | 'PEN' | 'PHP' | 'PLN' | 'QAR' | 'RON' | 'RUB' | 'RWF' | 'WST' | 'SAR' | 'RSD' | 'SCR' | 'SGD' | 'SDG' | 'SYP' | 'ZAR' | 'KRW' | 'SSP' | 'SBD' | 'LKR' | 'SRD' | 'SZL' | 'SEK' | 'CHF' | 'TWD' | 'THB' | 'TZS' | 'TTD' | 'TND' | 'TRY' | 'TMT' | 'UGX' | 'UAH' | 'AED' | 'UYU' | 'UZS' | 'VUV' | 'VND' | 'XOF' | 'YER' | 'ZMW' | 'BYN' | 'BYR' | 'DJF' | 'ERN' | 'FKP' | 'GIP' | 'GNF' | 'IRR' | 'KID' | 'LYD' | 'MRU' | 'SLL' | 'SHP' | 'SOS' | 'STD' | 'STN' | 'TJS' | 'TOP' | 'VED' | 'VEF' | 'VES' | 'XXX'", + "description": "" }, "NumberField": { "filePath": "src/surfaces/admin/components.ts", "name": "NumberField", - "description": "Configure the following properties on the number field component.", - "isPublicDocs": true, + "description": "The number field custom element class that renders a numeric input field in the Shopify admin interface. This component allows merchants to enter numbers with automatic validation and prefix/suffix display.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -114585,7 +128501,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inputMode", "value": "\"decimal\" | \"numeric\"", - "description": "The type of virtual keyboard to display on mobile devices.\n\n- `decimal`: Shows a numeric keyboard with a decimal point, suitable for prices or measurements.\n- `numeric`: Shows a numeric keyboard without a decimal point, suitable for whole numbers like quantities.\n\nLearn more about the [inputmode attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode).", + "description": "The input mode hint for mobile keyboards. Available values include:\n- `numeric`: Shows a numeric keypad optimized for entering numbers\n- `decimal`: Shows a numeric keypad with decimal point support\n- `tel`: Shows a telephone keypad", "defaultValue": "'decimal'" }, { @@ -114593,7 +128509,7 @@ "syntaxKind": "PropertyDeclaration", "name": "step", "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "description": "The granularity that the value must adhere to, or the keyword `any`. This controls the increment/decrement step size.", "defaultValue": "1" }, { @@ -114601,7 +128517,7 @@ "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum numeric value allowed in the field.", "defaultValue": "Infinity" }, { @@ -114609,7 +128525,7 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum numeric value allowed in the field.", "defaultValue": "-Infinity" }, { @@ -114617,7 +128533,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the user's input, such as a currency symbol.", "defaultValue": "''" }, { @@ -114625,7 +128541,7 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the user's input, such as a unit of measurement.", "defaultValue": "''" }, { @@ -114633,7 +128549,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | NumberAutocompleteField | `section-${string} one-time-code` | `section-${string} cc-number` | `section-${string} cc-csc` | \"shipping one-time-code\" | \"shipping cc-number\" | \"shipping cc-csc\" | \"billing one-time-code\" | \"billing cc-number\" | \"billing cc-csc\" | `section-${string} shipping one-time-code` | `section-${string} shipping cc-number` | `section-${string} shipping cc-csc` | `section-${string} billing one-time-code` | `section-${string} billing cc-number` | `section-${string} billing cc-csc`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -114641,35 +128557,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -114677,14 +128593,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -114692,7 +128608,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -114716,7 +128632,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -114740,7 +128656,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -114748,23 +128664,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -114802,7 +128725,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -114810,32 +128733,45 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class NumberField\n extends PreactFieldElement\n implements NumberFieldProps\n{\n /**\n * The current numeric value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string (decimal or integer).\n */\n get value(): string;\n set value(value: string);\n accessor inputMode: NumberFieldProps['inputMode'];\n accessor step: NumberFieldProps['step'];\n accessor max: NumberFieldProps['max'];\n accessor min: NumberFieldProps['min'];\n accessor prefix: NumberFieldProps['prefix'];\n accessor suffix: NumberFieldProps['suffix'];\n constructor();\n}" + "value": "declare class NumberField extends NumberFieldBase implements NumberFieldProps {\n constructor();\n}" }, "NumberAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "NumberAutocompleteField", "value": "'one-time-code' | 'cc-number' | 'cc-csc'", - "description": "Represents autocomplete values that are valid for number input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for numeric inputs.\n\nAvailable values:\n- `one-time-code` - One-time codes for authentication (OTP, 2FA codes)\n- `cc-number` - Credit card number\n- `cc-csc` - Credit card security code (CVV/CVC)", - "isPublicDocs": true + "description": "" }, "Option": { "filePath": "src/surfaces/admin/components.ts", "name": "Option", - "description": "Represents a single option within a select component. Use only as a child of s-select components.", - "isPublicDocs": true, + "description": "A single option within a select dropdown that users can choose.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the option is currently selected.", "defaultValue": "false" }, { @@ -114843,7 +128779,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the option should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -114851,16 +128787,23 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this option is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the option is disabled and can't be selected.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -114906,7 +128849,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -114914,24 +128857,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Option extends PreactCustomElement implements OptionProps {\n accessor selected: OptionProps['selected'];\n accessor defaultSelected: OptionProps['defaultSelected'];\n accessor value: OptionProps['value'];\n accessor disabled: OptionProps['disabled'];\n constructor();\n}" + "value": "declare class Option extends PolarisCustomElement implements OptionProps {\n /**\n * Whether the option is currently selected.\n */\n selected: OptionProps['selected'];\n /**\n * Whether the option should be selected when it's first rendered.\n */\n defaultSelected: OptionProps['defaultSelected'];\n /**\n * The value that's submitted with the form when this option is selected.\n */\n value: OptionProps['value'];\n /**\n * Whether the option is disabled and can't be selected.\n */\n disabled: OptionProps['disabled'];\n constructor();\n}" }, "OptionGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionGroup", - "description": "Represents a group of options within a select component. Use only as a child of `s-select` components.", - "isPublicDocs": true, + "description": "A group of related options within a select dropdown, displayed with a label.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the options within this group can be selected or not.", + "description": "Whether all options in the group are disabled and can't be selected.", "defaultValue": "false" }, { @@ -114939,7 +128896,14 @@ "syntaxKind": "PropertyDeclaration", "name": "label", "value": "string", - "description": "The user-facing label for this group of options." + "description": "The text that describes what this group of options represents." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -114986,7 +128950,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -114994,18 +128958,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OptionGroup\n extends PreactCustomElement\n implements OptionGroupProps\n{\n accessor disabled: OptionGroupProps['disabled'];\n accessor label: OptionGroupProps['label'];\n constructor();\n}" + "value": "declare class OptionGroup\n extends PolarisCustomElement\n implements OptionGroupProps\n{\n /**\n * Whether all options in the group are disabled and can't be selected.\n */\n disabled: OptionGroupProps['disabled'];\n /**\n * The text that describes what this group of options represents.\n */\n label: OptionGroupProps['label'];\n constructor();\n}" }, "OrderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "OrderedList", - "description": "Configure the following properties on the ordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a numbered list of items with automatic numbering and proper list semantics. Use ordered list when the sequence or order of items matters, such as instructions, rankings, or step-by-step processes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -115051,7 +129036,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -115059,48 +129044,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OrderedList\n extends PreactCustomElement\n implements OrderedListProps\n{\n constructor();\n}" + "value": "declare class OrderedList\n extends PolarisCustomElement\n implements OrderedListProps\n{\n constructor();\n}" }, "Paragraph": { "filePath": "src/surfaces/admin/components.ts", "name": "Paragraph", - "description": "Configure the following properties on the paragraph component.", - "isPublicDocs": true, + "description": "A custom element for displaying blocks of text content with consistent spacing and styling for readable body copy. Use Paragraph to render longer text content with proper line height and spacing between paragraphs.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "lineClamp", - "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", - "defaultValue": "Infinity - no truncation is applied" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the paragraph text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"caution\"", - "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "lineClamp", + "value": "number", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", + "defaultValue": "Infinity - no truncation is applied" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color of the paragraph text.", "defaultValue": "'base'" }, { @@ -115108,7 +129107,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -115116,9 +129115,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -115164,7 +129170,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -115172,24 +129178,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Paragraph extends PreactCustomElement implements ParagraphProps {\n accessor fontVariantNumeric: ParagraphProps['fontVariantNumeric'];\n accessor lineClamp: ParagraphProps['lineClamp'];\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: ParagraphProps['tone'];\n\n accessor color: ParagraphProps['color'];\n accessor dir: ParagraphProps['dir'];\n accessor accessibilityVisibility: ParagraphProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Paragraph extends ParagraphBase implements ParagraphProps {\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: ParagraphProps['tone'];\n constructor();\n}" }, "PasswordField": { "filePath": "src/surfaces/admin/components.ts", "name": "PasswordField", - "description": "Configure the following properties on the password field component.", - "isPublicDocs": true, + "description": "The password field custom element class that renders a password input field in the Shopify admin interface. This component allows merchants to enter passwords securely with characters automatically masked for privacy.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the password.", "defaultValue": "Infinity" }, { @@ -115197,22 +129217,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the password.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | PasswordAutocompleteField | `section-${string} current-password` | `section-${string} new-password` | \"shipping current-password\" | \"shipping new-password\" | \"billing current-password\" | \"billing new-password\" | `section-${string} shipping current-password` | `section-${string} shipping new-password` | `section-${string} billing current-password` | `section-${string} billing new-password`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -115220,35 +129233,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -115256,14 +129269,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -115271,7 +129284,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -115295,7 +129308,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -115319,7 +129332,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -115327,23 +129340,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -115381,7 +129408,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -115389,34 +129416,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class PasswordField\n extends PreactFieldElement\n implements PasswordFieldProps\n{\n accessor maxLength: PasswordFieldProps['maxLength'];\n accessor minLength: PasswordFieldProps['minLength'];\n /**\n * The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class PasswordField\n extends PasswordFieldBase\n implements PasswordFieldProps\n{\n constructor();\n}" }, "PasswordAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PasswordAutocompleteField", "value": "'current-password' | 'new-password'", - "description": "Represents autocomplete values that are valid for password input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for password inputs.\n\nAvailable values:\n- `current-password` - Existing password for login or authentication\n- `new-password` - New password when creating an account or changing password", - "isPublicDocs": true + "description": "" }, "QueryContainer": { "filePath": "src/surfaces/admin/components.ts", "name": "QueryContainer", - "description": "Configure the following properties on the query container component.", - "isPublicDocs": true, + "description": "A component that sets up a container query context, which lets child elements style themselves based on the container's size instead of the viewport size.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "containerName", "value": "string", - "description": "An identifier for this container that you can reference in CSS container queries to apply styles based on this specific container's size.\n\nAll query container components automatically receive a container name of `s-default`. You can omit the container name in your queries, so `@container (inline-size <= 300px)` is equivalent to `@container s-default (inline-size <= 300px)`.\n\nWhen you provide a custom `containerName`, it's added alongside `s-default`. For example, `containerName=\"product-card\"` results in `s-default product-card` being set on the `container-name` CSS property, allowing you to target this container with `@container product-card (inline-size <= 300px)`.\n\nLearn more about the [container-name property](https://developer.mozilla.org/en-US/docs/Web/CSS/container-name).", + "description": "The name of the container, which you can reference in CSS container queries.", "defaultValue": "''" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -115462,7 +129509,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -115470,24 +129517,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class QueryContainer\n extends PreactCustomElement\n implements QueryContainerProps\n{\n accessor containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" + "value": "declare class QueryContainer\n extends PolarisCustomElement\n implements QueryContainerProps\n{\n /**\n * The name of the container, which you can reference in CSS container queries.\n */\n containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" }, "SearchField": { "filePath": "src/surfaces/admin/components.ts", "name": "SearchField", - "description": "Configure the following properties on the search field component.", - "isPublicDocs": true, + "description": "A search field that lets users enter search queries with a search-specific input type.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters that can be entered in the field.", "defaultValue": "Infinity" }, { @@ -115495,22 +129556,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters that must be entered for the field to be valid.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -115518,35 +129572,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -115554,14 +129608,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -115569,7 +129623,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -115593,7 +129647,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -115617,7 +129671,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -115625,23 +129679,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -115679,7 +129747,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -115687,25 +129755,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class SearchField\n extends PreactFieldElement\n implements SearchFieldProps\n{\n accessor maxLength: SearchFieldProps['maxLength'];\n accessor minLength: SearchFieldProps['minLength'];\n /**\n * The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class SearchField extends SearchFieldBase implements SearchFieldProps {\n constructor();\n}" }, "TextAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" }, "Section": { "filePath": "src/surfaces/admin/components.ts", "name": "Section", - "description": "Configure the following properties on the section component.", - "isPublicDocs": true, + "description": "A section is a container that groups related content together with an optional heading.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -115715,28 +129796,43 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "The accessibility label for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The heading text displayed at the top of the section. This heading provides a title for the section's content and automatically uses the appropriate semantic heading level (h2, h3, h4) based on nesting depth to maintain proper document structure." + "description": "The heading text for the section." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "\"base\" | \"none\"", - "description": "The padding applied to all edges of the element.\n\n- `base`: applies padding that is appropriate for the element. Note that it might result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the section need to span to the edge of the section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "description": "Whether the section has padding.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -115753,14 +129849,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -115774,7 +129862,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -115782,59 +129870,73 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Section extends PreactCustomElement implements SectionProps {\n constructor();\n /** @private */\n connectedCallback(): void;\n accessor accessibilityLabel: SectionProps['accessibilityLabel'];\n accessor heading: SectionProps['heading'];\n accessor padding: SectionProps['padding'];\n}" + "value": "declare class Section extends SectionBase implements SectionProps {\n constructor();\n}" }, "Select": { "filePath": "src/surfaces/admin/components.ts", "name": "Select", - "description": "Configure the following properties on the select component.", - "isPublicDocs": true, + "description": "A select dropdown that lets users choose one option from a list.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier." + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the select." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the select when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the select is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "Text that appears in the select when no option is selected to provide a hint about what to choose." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether an option must be selected before the form can be submitted.", "defaultValue": "false" }, { @@ -115842,7 +129944,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -115866,7 +129968,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component." + "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected Option component." }, { "filePath": "src/surfaces/admin/components.ts", @@ -115879,15 +129981,15 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@usedFirstOptionSymbol@12029", + "name": "__@usedFirstOptionSymbol@17470", "value": "boolean", - "description": "A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n\nThis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.", + "description": "used to determine if no value or defaultValue was set, in which case the first non-disabled option was used\n\nthis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@hasInitialValueSymbol@12030", + "name": "__@hasInitialValueSymbol@17471", "value": "boolean", "description": "", "isPrivate": true @@ -115897,7 +129999,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -115905,23 +130007,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -115951,7 +130060,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -115959,33 +130068,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Select extends PreactInputElement implements SelectProps {\n accessor icon: SelectProps['icon'];\n accessor details: SelectProps['details'];\n accessor error: SelectProps['error'];\n accessor label: SelectProps['label'];\n accessor placeholder: SelectProps['placeholder'];\n accessor required: SelectProps['required'];\n accessor labelAccessibilityVisibility: SelectProps['labelAccessibilityVisibility'];\n /** @private */\n connectedCallback(): void;\n /**\n * A lifecycle callback that fires when the component is removed from the DOM. Performs cleanup operations.\n * @private\n */\n disconnectedCallback(): void;\n constructor();\n /**\n * A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n *\n * This is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.\n * @private\n */\n [usedFirstOptionSymbol]: boolean;\n /**\n * @private\n */\n [hasInitialValueSymbol]: boolean;\n /**\n * The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component.\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n}" + "value": "declare class Select extends SelectBase implements SelectProps {\n constructor();\n}" }, "Spinner": { "filePath": "src/surfaces/admin/components.ts", "name": "Spinner", - "description": "Configure the following properties on the spinner component.", - "isPublicDocs": true, + "description": "A component that displays an animated loading indicator to show that content is currently being processed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the spinner for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the loading spinner.\n\n- `base`: Default size suitable for inline loading indicators or standard UI contexts.\n- `large`: Larger spinner for more prominent loading states.\n- `large-100`: Extra large spinner for full-page or emphasized loading states.", + "description": "The size of the spinner.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -116031,7 +130161,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -116039,24 +130169,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Spinner extends PreactCustomElement implements SpinnerProps {\n accessor accessibilityLabel: string;\n accessor size: SpinnerProps['size'];\n constructor();\n}" + "value": "declare class Spinner extends PolarisCustomElement implements SpinnerProps {\n /**\n * A label that describes the spinner for assistive technologies.\n */\n accessibilityLabel: string;\n /**\n * The size of the spinner.\n */\n size: SpinnerProps['size'];\n constructor();\n}" }, "Stack": { "filePath": "src/surfaces/admin/components.ts", "name": "Stack", - "description": "Configure the following properties on the stack component.", - "isPublicDocs": true, + "description": "A stack is a layout component that arranges its children in a single direction with controlled spacing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "direction", "value": "MaybeResponsive<\"inline\" | \"block\">", - "description": "The direction in which the stack's children are placed within the stack.\n\nAccepts:\n- A single value, either `inline` or `block`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported direction values as a query value", + "description": "The direction in which the stack's children are arranged.", "defaultValue": "'block'" }, { @@ -116064,7 +130208,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "JustifyContentKeyword", - "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -116072,7 +130216,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "AlignItemsKeyword", - "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -116080,7 +130224,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "AlignContentKeyword", - "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.", "defaultValue": "'normal'" }, { @@ -116088,7 +130232,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between the stack's children.", "defaultValue": "'none'" }, { @@ -116096,7 +130240,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between rows in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -116104,7 +130248,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between columns in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -116112,7 +130256,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -116120,7 +130264,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -116128,7 +130272,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -116136,7 +130280,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -116144,7 +130288,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -116152,7 +130296,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -116160,7 +130304,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -116168,7 +130312,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -116176,7 +130320,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -116184,7 +130328,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -116192,7 +130336,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -116200,7 +130344,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -116208,7 +130352,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -116216,7 +130360,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -116224,7 +130368,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -116232,7 +130376,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -116240,7 +130384,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -116260,7 +130404,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -116268,7 +130412,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -116276,7 +130420,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -116284,7 +130428,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -116292,14 +130436,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -116307,9 +130451,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -116355,7 +130506,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -116363,32 +130514,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n accessor direction: StackProps['direction'];\n accessor justifyContent: StackProps['justifyContent'];\n accessor alignItems: StackProps['alignItems'];\n accessor alignContent: StackProps['alignContent'];\n accessor gap: StackProps['gap'];\n accessor rowGap: StackProps['rowGap'];\n accessor columnGap: StackProps['columnGap'];\n}" + "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n /**\n * The direction in which the stack's children are arranged.\n */\n direction: StackProps['direction'];\n /**\n * Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n */\n justifyContent: StackProps['justifyContent'];\n /**\n * Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n */\n alignItems: StackProps['alignItems'];\n /**\n * Controls the distribution of lines along the block axis when content wraps into multiple lines.\n */\n alignContent: StackProps['alignContent'];\n /**\n * The spacing between the stack's children.\n */\n gap: StackProps['gap'];\n /**\n * The spacing between rows in the stack.\n */\n rowGap: StackProps['rowGap'];\n /**\n * The spacing between columns in the stack.\n */\n columnGap: StackProps['columnGap'];\n}" }, "Switch": { "filePath": "src/surfaces/admin/components.ts", "name": "Switch", - "description": "Configure the following properties on the switch component.", - "isPublicDocs": true, + "description": "A switch that lets users toggle a setting on or off with a sliding control.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -116403,7 +130575,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -116411,28 +130583,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -116455,7 +130627,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -116463,23 +130635,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -116525,7 +130704,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -116533,24 +130712,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Switch extends PreactCheckboxElement implements SwitchProps {\n accessor labelAccessibilityVisibility: SwitchProps['labelAccessibilityVisibility'];\n constructor();\n}" + "value": "declare class Switch extends SwitchBase implements SwitchProps {\n constructor();\n}" }, "Table": { "filePath": "src/surfaces/admin/components.ts", "name": "Table", - "description": "Configure the following properties on the table component.", - "isPublicDocs": true, + "description": "A component that displays data in a structured table format that automatically adapts to the available space.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "variant", "value": "\"auto\" | \"list\"", - "description": "The layout variant of the table component.\n\n- `list`: Always displays as a list layout.\n- `table`: Always displays as a traditional table layout.\n- `auto`: Automatically displays as a table on wide screens and as a list on narrow screens.", + "description": "The display variant of the table.", "defaultValue": "'auto'" }, { @@ -116558,7 +130751,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table. When `true`, the table might be in an inert state that prevents user interaction.", + "description": "Whether the table is currently in a loading state.", "defaultValue": "false" }, { @@ -116566,7 +130759,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paginate", "value": "boolean", - "description": "Whether to use pagination controls.", + "description": "Whether the pagination controls are displayed.", "defaultValue": "false" }, { @@ -116574,7 +130767,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hasPreviousPage", "value": "boolean", - "description": "Whether there's a previous page of data.", + "description": "Whether there's a previous page of data that the user can navigate to.", "defaultValue": "false" }, { @@ -116582,25 +130775,40 @@ "syntaxKind": "PropertyDeclaration", "name": "hasNextPage", "value": "boolean", - "description": "Whether there's an additional page of data.", + "description": "Whether there's a next page of data that the user can navigate to.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@actualTableVariantSymbol@12105", - "value": "AddedContext", + "name": "__@elementInternals@17552", + "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@tableHeadersSharedDataSymbol@12106", - "value": "AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", + "name": "__@actualTableVariantSymbol@17550", + "value": "_shopify_admin_web_component_foundations.AddedContext", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@tableHeadersSharedDataSymbol@17551", + "value": "_shopify_admin_web_component_foundations.AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -116646,7 +130854,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -116654,78 +130862,69 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Table extends PreactCustomElement implements TableProps {\n accessor variant: TableProps['variant'];\n accessor loading: TableProps['loading'];\n accessor paginate: TableProps['paginate'];\n accessor hasPreviousPage: TableProps['hasPreviousPage'];\n accessor hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" - }, - "AddedContext": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AddedContext", - "description": "", - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "T", - "description": "The current context value.\n\nThe new context value to set, which will notify all consumers." }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "addEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", - "description": "The **`addEventListener()`** method of the EventTarget interface sets up a function that will be called whenever the specified event is delivered to the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener)" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "dispatchEvent", - "value": "(event: Event) => boolean", - "description": "The **`dispatchEvent()`** method of the EventTarget sends an Event to the object, (synchronously) invoking the affected event listeners in the appropriate order.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/dispatchEvent)" + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "removeEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", - "description": "The **`removeEventListener()`** method of the EventTarget interface removes an event listener previously registered with EventTarget.addEventListener() from the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/removeEventListener)" + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AddedContext extends EventTarget {\n constructor(defaultValue: T);\n /**\n * The current context value.\n */\n get value(): T;\n /**\n * The new context value to set, which will notify all consumers.\n */\n set value(value: T);\n}" + "value": "declare class Table extends PolarisCustomElement implements TableProps {\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The display variant of the table.\n */\n variant: TableProps['variant'];\n /**\n * Whether the table is currently in a loading state.\n */\n loading: TableProps['loading'];\n /**\n * Whether the pagination controls are displayed.\n */\n paginate: TableProps['paginate'];\n /**\n * Whether there's a previous page of data that the user can navigate to.\n */\n hasPreviousPage: TableProps['hasPreviousPage'];\n /**\n * Whether there's a next page of data that the user can navigate to.\n */\n hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: _shopify_admin_web_component_foundations.AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: _shopify_admin_web_component_foundations.AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" }, "ActualTableVariant": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ActualTableVariant", "value": "'table' | 'list'", - "description": "Represents the actual rendered variant of a table component.\n- `table`: Displays as a traditional table layout.\n- `list`: Displays as a list layout.", - "isPublicDocs": true + "description": "" }, "ListSlotType": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ListSlotType", "value": "'primary' | 'secondary' | 'kicker' | 'inline' | 'labeled'", - "description": "Represents the semantic type of content slots within list items.\n\n- `primary`: The main content or title of the list item.\n- `secondary`: Supporting or descriptive content below the primary content.\n- `kicker`: A small label or tag displayed above the primary content.\n- `inline`: Content displayed inline with the primary content.\n- `labeled`: Content with an associated label.", - "isPublicDocs": true + "description": "" }, "HeaderFormat": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true }, "TableBody": { "filePath": "src/surfaces/admin/components.ts", "name": "TableBody", - "description": "The table body component represents the main content area of a table, containing the data rows. Use table body as a child of table to structure your table data, with each table row within the body representing a single record or entry.\n\nTable body must contain table row components, which in turn contain table cell components for the actual data values.", - "isPublicDocs": true, + "description": "A component that wraps the body content of a table, which contains the data rows.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -116771,7 +130970,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -116779,26 +130978,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableBody extends PreactCustomElement implements TableBodyProps {\n constructor();\n}" + "value": "declare class TableBody extends PolarisCustomElement implements TableBodyProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n}" }, "TableCell": { "filePath": "src/surfaces/admin/components.ts", "name": "TableCell", - "description": "The table cell component represents a single data cell within a table row. Use table cell as a child of table row to display individual data values, with each cell corresponding to a column in the table.\n\nTable cell automatically inherits styling and alignment from its parent table structure and supports text content or other inline components.", - "isPublicDocs": true, + "description": "A component that represents a single cell in a table row, which displays data in a format that's determined by its column header.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", - "name": "__@headerFormatSymbol@12128", + "name": "__@headerFormatSymbol@17578", "value": "HeaderFormat", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -116844,7 +131072,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -116852,24 +131080,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableCell extends PreactCustomElement implements TableCellProps {\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" + "value": "declare class TableCell extends PolarisCustomElement implements TableCellProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" }, "TableHeader": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeader", - "description": "The table header component represents a single column header within a table header row. Use table header as a child of table header row to define column headings and optionally enable column sorting.\n\nTable header provides semantic meaning for screen readers and can include sorting controls when configured. Each header corresponds to a column in the table body.", - "isPublicDocs": true, + "description": "A component that defines a column header in a table, which specifies both the header label and how the column's data should be formatted.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "listSlot", "value": "ListSlotType", - "description": "The content designation for this column when the table displays in list variant on mobile devices.", + "description": "The slot where this header's data appears when the table is shown in list view.", "defaultValue": "'labeled'" }, { @@ -116877,7 +131119,22 @@ "syntaxKind": "PropertyDeclaration", "name": "format", "value": "HeaderFormat", - "description": "The format of the column that controls styling and alignment of cell content." + "description": "The format of the header and its corresponding cells." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -116924,7 +131181,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -116932,17 +131189,31 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeader\n extends PreactCustomElement\n implements TableHeaderProps\n{\n accessor listSlot: TableHeaderProps['listSlot'];\n accessor format: TableHeaderProps['format'];\n constructor();\n}" + "value": "declare class TableHeader\n extends PolarisCustomElement\n implements TableHeaderProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The slot where this header's data appears when the table is shown in list view.\n */\n listSlot: TableHeaderProps['listSlot'];\n /**\n * The format of the header and its corresponding cells.\n */\n format: TableHeaderProps['format'];\n constructor();\n}" }, "TableHeaderRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeaderRow", - "description": "The table header row component represents the header row of a table, containing column headings. Use table header row as the first child of table (before table body) to define the table structure and provide column labels.\n\nTable header row must contain table header components for each column. These headers provide context for the data columns and can support sorting functionality.", - "isPublicDocs": true, + "description": "A component that wraps the header row of a table, which contains the table header components that define the column structure.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -116960,6 +131231,21 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -116989,7 +131275,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -116997,24 +131283,53 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeaderRow\n extends PreactCustomElement\n implements TableHeaderRowProps\n{\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class TableHeaderRow\n extends PolarisCustomElement\n implements TableHeaderRowProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "TableRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableRow", - "description": "The table row component represents a single row of data within a table body. Use table row as a child of table body to structure individual records or entries in the table.\n\nTable row must contain table cell components, with each cell representing a data value for the corresponding column. The number of cells should match the number of headers in the table.", - "isPublicDocs": true, + "description": "A component that represents a single row in a table, which contains the data cells.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "clickDelegate", "value": "string", - "description": "The ID of an interactive element, such as `s-link`, in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally." + "description": "A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -117061,7 +131376,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -117069,41 +131384,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableRow extends PreactCustomElement implements TableRowProps {\n constructor();\n accessor clickDelegate: string;\n}" + "value": "declare class TableRow extends PolarisCustomElement implements TableRowProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /**\n * A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector.\n */\n clickDelegate: string;\n}" }, "Text": { "filePath": "src/surfaces/admin/components.ts", "name": "Text", - "description": "Configure the following properties on the text component.", - "isPublicDocs": true, + "description": "A custom element for displaying inline or small blocks of text with various visual styles and semantic meanings. Use Text to render short pieces of content with appropriate styling, emphasis, and color treatment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color of the text.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", @@ -117118,7 +131447,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -117126,7 +131455,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, { @@ -117134,7 +131463,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The ID of an element this text provides contextual information for." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -117181,7 +131517,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -117189,24 +131525,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Text extends PreactCustomElement implements TextProps {\n accessor fontVariantNumeric: TextProps['fontVariantNumeric'];\n accessor color: TextProps['color'];\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: TextProps['tone'];\n /**\n * The semantic type and styling treatment for the text content.\n *\n * - `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n * - `generic`: Standard text with no special semantic meaning or styling.\n * - `address`: Marks the text as contact information, such as a physical or email address.\n * - `redundant`: Indicates the text is redundant or duplicated information for screen reader context.\n */\n accessor type: TextProps['type'];\n accessor dir: TextProps['dir'];\n accessor accessibilityVisibility: TextProps['accessibilityVisibility'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Text extends TextBase implements TextProps {\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: TextProps['tone'];\n constructor();\n}" }, "TextArea": { "filePath": "src/surfaces/admin/components.ts", "name": "TextArea", - "description": "Configure the following properties on the text area component.", - "isPublicDocs": true, + "description": "The text area custom element class that renders a multi-line text input field in the Shopify admin interface. This component allows merchants to enter and edit longer text content with support for labels, validation, and length constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -117214,7 +131564,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, { @@ -117222,22 +131572,15 @@ "syntaxKind": "PropertyDeclaration", "name": "rows", "value": "number", - "description": "A number of visible text lines.", + "description": "The number of visible text lines for the field, controlling its initial height.", "defaultValue": "2" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -117245,35 +131588,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -117281,14 +131624,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -117296,7 +131639,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -117320,7 +131663,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -117344,7 +131687,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -117352,23 +131695,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -117406,7 +131763,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -117414,24 +131771,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextArea\n extends PreactFieldElement\n implements TextAreaProps\n{\n accessor maxLength: TextAreaProps['maxLength'];\n accessor minLength: TextAreaProps['minLength'];\n accessor rows: TextAreaProps['rows'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextArea extends TextAreaBase implements TextAreaProps {\n constructor();\n}" }, "TextField": { "filePath": "src/surfaces/admin/components.ts", "name": "TextField", - "description": "Configure the following properties on the text field component.", - "isPublicDocs": true, + "description": "The text field custom element class that renders a single-line text input field in the Shopify admin interface. This component allows merchants to enter and edit text with support for labels, validation, icons, and prefix/suffix content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\" | AnyString", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "value": "IconType | AnyString", + "description": "An icon to display at the start of the text field, providing visual context for the input. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", "defaultValue": "''" }, { @@ -117439,7 +131810,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the merchant can enter in the field. When this limit is reached, the field prevents further input.", "defaultValue": "Infinity" }, { @@ -117447,7 +131818,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation. The field will be considered invalid if the merchant enters fewer characters than this value.", "defaultValue": "0" }, { @@ -117455,7 +131826,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the merchant's input, such as a currency symbol (`$`) or protocol (`https://`).", "defaultValue": "''" }, { @@ -117463,22 +131834,15 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the merchant's input, such as a unit of measurement (`kg`, `%`) or domain (`.myshopify.com`).", "defaultValue": "''" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -117486,35 +131850,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -117522,14 +131886,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -117537,7 +131901,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -117561,7 +131925,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -117585,7 +131949,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -117593,23 +131957,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -117647,7 +132025,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -117655,41 +132033,62 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextField\n extends PreactFieldElement\n implements TextFieldProps\n{\n accessor icon: TextFieldProps['icon'];\n accessor maxLength: TextFieldProps['maxLength'];\n accessor minLength: TextFieldProps['minLength'];\n accessor prefix: TextFieldProps['prefix'];\n accessor suffix: TextFieldProps['suffix'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextField extends TextFieldBase implements TextFieldProps {\n constructor();\n}" }, "Thumbnail": { "filePath": "src/surfaces/admin/components.ts", "name": "Thumbnail", - "description": "Configure the following properties on the thumbnail component.", - "isPublicDocs": true, + "description": "A thumbnail displays a small preview image with configurable sizing.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display in the thumbnail." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the product thumbnail image.\n\n- `small-200`: Smallest thumbnail size, ideal for compact product lists or tables.\n- `small-100`: Very small thumbnail, suitable for dense layouts.\n- `small`: Small thumbnail for space-constrained contexts.\n- `base`: Default size that balances visibility and space efficiency.\n- `large`: Larger thumbnail for featured products or detailed views.\n- `large-100`: Extra large thumbnail for prominent product display.", + "description": "The size of the thumbnail.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -117735,7 +132134,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -117743,22 +132142,36 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Thumbnail extends PreactCustomElement implements ThumbnailProps {\n accessor src: ThumbnailProps['src'];\n accessor alt: ThumbnailProps['alt'];\n accessor size: ThumbnailProps['size'];\n constructor();\n}" + "value": "declare class Thumbnail extends PolarisCustomElement implements ThumbnailProps {\n /**\n * The URL of the image to display in the thumbnail.\n */\n src: ThumbnailProps['src'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ThumbnailProps['alt'];\n /**\n * The size of the thumbnail.\n */\n size: ThumbnailProps['size'];\n constructor();\n}" }, "Tooltip": { "filePath": "src/surfaces/admin/components.ts", "name": "Tooltip", - "description": "Configure the following properties on the tooltip component.", - "isPublicDocs": true, + "description": "A component that displays a small popup with explanatory text when the user hovers over or focuses on an element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true @@ -117766,7 +132179,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true @@ -117774,11 +132187,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -117824,7 +132244,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -117832,8 +132252,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Tooltip extends PreactOverlayElement implements TooltipProps {\n constructor();\n}" @@ -117841,9 +132276,15 @@ "UnorderedList": { "filePath": "src/surfaces/admin/components.ts", "name": "UnorderedList", - "description": "Configure the following properties on the unordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a bulleted list of items where the order doesn't matter. Use unordered list when you have a collection of related items without a specific sequence, such as features, options, or bullet points.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -117889,7 +132330,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -117897,32 +132338,46 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class UnorderedList\n extends PreactCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" + "value": "declare class UnorderedList\n extends PolarisCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" }, "URLField": { "filePath": "src/surfaces/admin/components.ts", "name": "URLField", - "description": "Configure the following properties on the URL field component.", - "isPublicDocs": true, + "description": "The URL field custom element class that renders a URL input field in the Shopify admin interface. This component allows merchants to enter web addresses with automatic URL validation and appropriate mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | `section-${string} url` | `section-${string} photo` | `section-${string} impp` | `section-${string} home impp` | `section-${string} mobile impp` | `section-${string} fax impp` | `section-${string} pager impp` | \"shipping url\" | \"shipping photo\" | \"shipping impp\" | \"shipping home impp\" | \"shipping mobile impp\" | \"shipping fax impp\" | \"shipping pager impp\" | \"billing url\" | \"billing photo\" | \"billing impp\" | \"billing home impp\" | \"billing mobile impp\" | \"billing fax impp\" | \"billing pager impp\" | `section-${string} shipping url` | `section-${string} shipping photo` | `section-${string} shipping impp` | `section-${string} shipping home impp` | `section-${string} shipping mobile impp` | `section-${string} shipping fax impp` | `section-${string} shipping pager impp` | `section-${string} billing url` | `section-${string} billing photo` | `section-${string} billing impp` | `section-${string} billing home impp` | `section-${string} billing mobile impp` | `section-${string} billing fax impp` | `section-${string} billing pager impp` | URLAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint about the intended content of the field for browser autofill.", + "defaultValue": "'url'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the URL.", "defaultValue": "Infinity" }, { @@ -117930,50 +132385,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the URL.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -117981,14 +132429,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -117996,7 +132444,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -118020,7 +132468,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -118044,7 +132492,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -118052,23 +132500,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -118106,7 +132568,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -118114,41 +132576,61 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class URLField\n extends PreactFieldElement\n implements URLFieldProps\n{\n accessor autocomplete: URLFieldProps['autocomplete'];\n accessor maxLength: URLFieldProps['maxLength'];\n accessor minLength: URLFieldProps['minLength'];\n /**\n * The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class URLField extends URLFieldBase implements URLFieldProps {\n constructor();\n}" }, "URLAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "URLAutocompleteField", "value": "'url' | 'photo' | 'impp' | 'home impp' | 'mobile impp' | 'fax impp' | 'pager impp'", - "description": "Represents autocomplete values that are valid for URL input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for URL inputs.\n\nAvailable values:\n- `url` - General URL or web address\n- `photo` - URL to a photo or image\n- `impp` - Instant messaging protocol URL\n- `home impp` - Home instant messaging protocol URL\n- `mobile impp` - Mobile instant messaging protocol URL\n- `fax impp` - Fax instant messaging protocol URL\n- `pager impp` - Pager instant messaging protocol URL", - "isPublicDocs": true + "description": "" }, "AdminAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminAction", - "description": "Configure the following properties on the admin action component.", - "isPublicDocs": true, + "description": "The admin action custom element class that renders action controls in the Shopify admin interface. This component creates a standardized action area with a heading and slots for primary and secondary action buttons, used exclusively in admin action extensions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text to use as the Action modal's title. If not provided, the name of the extension will be used." + "description": "The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the action is in a loading state, such as during initial page load or when the action is being opened. When `true`, the action might be in an inert state that prevents user interaction.", + "description": "Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -118194,7 +132676,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -118202,11 +132684,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminAction\n extends PreactCustomElement\n implements AdminActionProps\n{\n /**\n * The text to use as the Action modal's title. If not provided, the name of the extension will be used.\n */\n heading: string;\n /**\n * Whether the action is in a loading state, such as during initial page load or when the action is being opened.\n * When `true`, the action might be in an inert state that prevents user interaction.\n */\n loading: boolean;\n constructor();\n}" + "value": "declare class AdminAction\n extends PolarisCustomElement\n implements AdminActionProps\n{\n /**\n * The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading.\n */\n heading: string;\n /**\n * Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.\n *\n * @default false\n */\n loading: boolean;\n constructor();\n}" }, "RunnableExtension": { "filePath": "src/extension.ts", @@ -118419,22 +132916,28 @@ "AdminBlock": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminBlock", - "description": "Configure the following properties on the admin block component.", - "isPublicDocs": true, + "description": "The admin block custom element class that renders a collapsible content block in the Shopify admin interface. This component organizes content into expandable sections with headings and provides a summary when collapsed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text displayed as the block's title in the header. If not provided, the extension name will be used." + "description": "The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "collapsedSummary", "value": "string", - "description": "The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated." + "description": "The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -118481,7 +132984,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -118489,18 +132992,39 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminBlock\n extends PreactCustomElement\n implements AdminBlockProps\n{\n /**\n * The text displayed as the block's title in the header. If not provided, the extension name will be used.\n */\n heading: string;\n /**\n * The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated.\n */\n collapsedSummary: string;\n constructor();\n}" + "value": "declare class AdminBlock\n extends PolarisCustomElement\n implements AdminBlockProps\n{\n /**\n * The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed.\n */\n heading: string;\n /**\n * The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed.\n */\n collapsedSummary: string;\n constructor();\n}" }, "Form": { "filePath": "src/surfaces/admin/components.ts", "name": "Form", - "description": "Configure the following properties on the form component.", - "isPublicDocs": true, + "description": "The form custom element class that renders a form container in the Shopify admin interface. This component manages form submission, validation, and reset behavior for collecting merchant input.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -118546,7 +133070,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -118554,11 +133078,114 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Form extends PreactCustomElement implements FormProps {\n constructor();\n}" + "value": "declare class Form extends PolarisCustomElement implements FormProps {\n constructor();\n}" + }, + "IntentRenderApi": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderApi", + "description": "The `IntentRenderApi` object provides methods for extensions that render in response to an app intent. Access the intent data to determine what action the merchant requested and use `intents.response` to resolve the intent when complete.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "auth", + "value": "Auth", + "description": "Provides methods for authenticating calls to your app backend. Use the `idToken()` method to retrieve a signed JWT token that verifies the current user's identity for secure server-side operations." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "extension", + "value": "{ target: ExtensionTarget; }", + "description": "The identifier of the running extension target. Use this to determine which target your extension is rendering in and conditionally adjust functionality or UI based on the extension context." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "i18n", + "value": "I18n", + "description": "Utilities for translating content according to the current localization of the admin. Use these methods to provide translated strings that match the merchant's language preferences, ensuring your extension is accessible to a global audience." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "intents", + "value": "IntentRenderIntents", + "description": "Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "picker", + "value": "PickerApi", + "description": "Opens a custom selection dialog with your app-specific data. Use the [Picker API](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/picker-api) to define the picker's heading, items, headers, and selection behavior. Returns a Promise that resolves to a `Picker` object with a `selected` property for accessing the merchant's selection." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "query", + "value": "(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>", + "description": "Executes GraphQL queries against the [GraphQL Admin API](/docs/api/admin-graphql). Use this to fetch shop data, manage resources, or perform mutations. Queries are automatically authenticated with the current user's permissions. Optionally specify GraphQL variables and API version for your query." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "resourcePicker", + "value": "ResourcePickerApi", + "description": "Opens the [resource picker](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/resource-picker-api) modal for selecting products, variants, or collections. Returns the selected resources when the user confirms their selection, or undefined if they cancel." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "storage", + "value": "Storage", + "description": "Provides methods for persisting data in browser storage that is scoped to your extension. Use this to store user preferences, cache data, maintain state across sessions, or save temporary working data. Storage is persistent across page reloads and isolated per extension." + } + ], + "value": "export interface IntentRenderApi\n extends StandardRenderingExtensionApi {\n /**\n * Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow.\n */\n intents: IntentRenderIntents;\n}" + }, + "IntentRenderIntents": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderIntents", + "description": "The intents API available to intent render extensions. Unlike other targets where `response` is optional, intent render extensions always run inside an intent workflow so `response` is guaranteed.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled." + } + ], + "value": "export interface IntentRenderIntents {\n /**\n * Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled.\n */\n response: IntentResponseApi;\n}" + }, + "FormExtensionComponents": { + "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "FormExtensionComponents", + "value": "StandardComponents | 'Form'", + "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." }, "CustomerSegmentTemplateApi": { "filePath": "src/surfaces/admin/api/customer-segment-template/customer-segment-template.ts", @@ -119138,19 +133765,18 @@ "value": "FormExtensionComponents | 'FunctionSettings'", "description": "The components available for building function settings extensions. Includes all form components plus the function settings component required for function settings configuration." }, - "FormExtensionComponents": { - "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "FormExtensionComponents", - "value": "StandardComponents | 'Form'", - "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." - }, "FunctionSettings": { "filePath": "src/surfaces/admin/components.ts", "name": "FunctionSettings", - "description": "Configure the following properties on the function settings component.", - "isPublicDocs": true, + "description": "The function settings custom element class that renders a specialized form for configuring Shopify Function settings in the admin interface. This component manages function configuration submission, validation, and error handling.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -119196,7 +133822,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -119204,8 +133830,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class FunctionSettings\n extends PreactCustomElement\n implements FunctionSettingsProps\n{\n constructor();\n}" @@ -119292,15 +133933,21 @@ "AdminPrintAction": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminPrintAction", - "description": "Configure the following properties on the admin print action component.", - "isPublicDocs": true, + "description": "The admin print action custom element class that renders a print interface in the Shopify admin. This component enables merchants to print content from a specified source URL using the browser's print functionality.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The `src` URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs, and images are supported." + "description": "The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -119347,7 +133994,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -119355,11 +134002,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminPrintAction\n extends PreactCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The `src` URL of the preview and the document to print.\n * If not provided, the preview will show an empty state and the print button will be disabled.\n * HTML, PDFs, and images are supported.\n */\n src: string;\n constructor();\n}" + "value": "declare class AdminPrintAction\n extends PolarisCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action.\n */\n src: string;\n constructor();\n}" }, "ProductDetailsConfigurationApi": { "filePath": "src/surfaces/admin/api/product-configuration/product-details-configuration.ts", @@ -120246,7 +134908,7 @@ "AdminActionProps": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminActionProps", - "description": "Configure the following properties on the admin action component.", + "description": "The properties for the admin action component. These properties configure the heading and loading state of the admin action extension interface.", "isPublicDocs": true, "members": [ { @@ -120254,7 +134916,7 @@ "syntaxKind": "PropertySignature", "name": "heading", "value": "string", - "description": "The text to use as the action modal's title. If not provided, the name of the extension will be used.", + "description": "The text to use as the Action modal’s title. If not provided, the name of the extension will be used.", "isOptional": true }, { @@ -120262,7 +134924,7 @@ "syntaxKind": "PropertySignature", "name": "loading", "value": "boolean", - "description": "Whether the action is in a loading state, such as during initial page load or when the action is being opened. When `true`, the action is in an inert state that prevents user interaction.", + "description": "Whether the action is in a loading state, such as initial page load or action opening. When true, the action could be in an inert state, which prevents user interaction.", "isOptional": true, "defaultValue": "false" } @@ -120279,15 +134941,14 @@ "AdminActionSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminActionSlots", - "description": "The admin action component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "primary-action", "value": "HTMLElement", - "description": "The main action button or link displayed in the admin action modal. This represents the primary or most important action that users can take in this modal context, typically displayed with high visual prominence.", + "description": "The primary action button or link to display in the admin action area. This is the main call-to-action that appears prominently in the interface. Typically uses a button component with `variant=\"primary\"` to complete or advance the workflow.", "isOptional": true }, { @@ -120295,11 +134956,11 @@ "syntaxKind": "PropertySignature", "name": "secondary-actions", "value": "HTMLElement", - "description": "Additional action buttons or links displayed in the admin action modal. These provide alternative or supporting actions, visually de-emphasized compared to the primary action to establish clear hierarchy.", + "description": "The secondary action buttons or links to display in the admin action area. These are supporting actions like cancel, back, or alternative operations. Typically uses button components with `variant=\"secondary\"` or `variant=\"tertiary\"`.", "isOptional": true } ], - "value": "export interface AdminActionSlots {\n /**\n * The main action button or link displayed in the admin action modal.\n * This represents the primary or most important action that users can take in this modal context, typically displayed with high visual prominence.\n */\n 'primary-action': HTMLElement;\n /**\n * Additional action buttons or links displayed in the admin action modal.\n * These provide alternative or supporting actions, visually de-emphasized compared to the primary action to establish clear hierarchy.\n */\n 'secondary-actions': HTMLElement;\n}" + "value": "export interface AdminActionSlots {\n /**\n * The primary action button or link to display in the admin action area. This is the main call-to-action that appears prominently in the interface. Typically uses a button component with `variant=\"primary\"` to complete or advance the workflow.\n */\n 'primary-action': HTMLElement;\n /**\n * The secondary action buttons or links to display in the admin action area. These are supporting actions like cancel, back, or alternative operations. Typically uses button components with `variant=\"secondary\"` or `variant=\"tertiary\"`.\n */\n 'secondary-actions': HTMLElement;\n}" } } } @@ -120429,7 +135090,7 @@ "AdminBlockProps": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminBlockProps", - "description": "Configure the following properties on the admin block component.", + "description": "The properties for the admin block component. These properties configure the heading and collapsed summary of collapsible content blocks in the admin interface.", "isPublicDocs": true, "members": [ { @@ -120437,7 +135098,7 @@ "syntaxKind": "PropertySignature", "name": "collapsedSummary", "value": "string", - "description": "The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated.", + "description": "The summary to display when the app block is collapsed. Summary longer than 30 characters will be truncated.", "isOptional": true }, { @@ -120445,7 +135106,7 @@ "syntaxKind": "PropertySignature", "name": "heading", "value": "string", - "description": "The text displayed as the block's title in the header. If not provided, the extension name will be used.", + "description": "The text to use as the Block title in the block header. If not provided, the name of the extension will be used.", "isOptional": true } ], @@ -120585,7 +135246,7 @@ "AdminPrintActionProps": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminPrintActionProps", - "description": "Configure the following properties on the admin print action component.", + "description": "The properties for the admin print action component. These properties configure the source URL for printing content within admin extensions.", "isPublicDocs": true, "members": [ { @@ -120593,7 +135254,7 @@ "syntaxKind": "PropertySignature", "name": "src", "value": "string", - "description": "The URL of the document to preview and print. Supports HTML, PDF, and image formats. If not provided, the preview will show an empty state and the print button will be disabled.", + "description": "Sets the src URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs and images are supported.", "isOptional": true } ], @@ -120714,9 +135375,25 @@ "Avatar": { "filePath": "src/surfaces/admin/components.ts", "name": "Avatar", - "description": "Configure the following properties on the avatar component.", - "isPublicDocs": true, + "description": "An avatar displays a user or entity image with fallback initials when the image isn't available.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -120731,7 +135408,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the avatar for accessibility.\n\nProvides a text description of the avatar for users with assistive technology and serves as a fallback when the avatar fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an avatar, it reads this description aloud. When an avatar fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", + "description": "Alternative text that describes the avatar for screen readers.", "isOptional": true }, { @@ -120748,7 +135425,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -120775,7 +135452,7 @@ "syntaxKind": "PropertyDeclaration", "name": "initials", "value": "string", - "description": "The initials to display in the avatar when no image is provided or fails to load. Typically one or two characters representing a person's first and last name initials, such as \"JD\" for John Doe.", + "description": "The initials to display when no image is provided or if the image fails to load.", "isOptional": true }, { @@ -120783,7 +135460,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -120801,7 +135478,7 @@ "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"base\" | \"large\" | \"large-200\"", - "description": "The size of the avatar image.\n\n- `small-200`: Extra small avatar, suitable for compact displays or lists with many items.\n- `small`: Small avatar, good for secondary contexts or tight layouts.\n- `base`: Default size that works well in most contexts.\n- `large`: Large avatar for emphasis or when the avatar is a focal point.\n- `large-200`: Extra large avatar for prominent display.", + "description": "The size of the avatar.", "defaultValue": "'base'", "isOptional": true }, @@ -120810,17 +135487,24 @@ "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The URL or path to the avatar image. When provided, the image takes priority over `initials`. If the image fails to load or loads slowly, `initials` will be rendered as a fallback.", + "description": "The URL of the avatar image to display.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", "isOptional": true } ], - "value": "declare class Avatar extends PreactCustomElement implements AvatarProps {\n accessor initials: AvatarProps['initials'];\n accessor src: AvatarProps['src'];\n accessor size: AvatarProps['size'];\n accessor alt: AvatarProps['alt'];\n constructor();\n}" + "value": "declare class Avatar extends PolarisCustomElement implements AvatarProps {\n /**\n * The initials to display when no image is provided or if the image fails to load.\n */\n initials: AvatarProps['initials'];\n /**\n * The URL of the avatar image to display.\n */\n src: AvatarProps['src'];\n /**\n * The size of the avatar.\n */\n size: AvatarProps['size'];\n /**\n * Alternative text that describes the avatar for screen readers.\n */\n alt: AvatarProps['alt'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -120843,7 +135527,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -120851,7 +135535,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -120859,7 +135543,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -120867,11 +135551,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -120883,15 +135567,14 @@ "AvatarEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "AvatarEvents", - "description": "The avatar component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "error", "value": "OnErrorEventHandler", - "description": "A callback fired when the avatar image fails to load.\n\nLearn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).", + "description": "A callback that's fired when the avatar image fails to load.", "isOptional": true }, { @@ -120899,27 +135582,25 @@ "syntaxKind": "PropertySignature", "name": "load", "value": "CallbackEventListener | null", - "description": "A callback fired when the avatar image successfully loads.\n\nLearn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).", + "description": "A callback that's fired when the avatar image has loaded successfully.", "isOptional": true } ], - "value": "export interface AvatarEvents {\n /**\n * A callback fired when the avatar image successfully loads.\n *\n * Learn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback fired when the avatar image fails to load.\n *\n * Learn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).\n */\n error: OnErrorEventHandler = null;\n}" + "value": "export interface AvatarEvents {\n /**\n * A callback that's fired when the avatar image has loaded successfully.\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback that's fired when the avatar image fails to load.\n */\n error: OnErrorEventHandler = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -121104,9 +135785,25 @@ "Badge": { "filePath": "src/surfaces/admin/components.ts", "name": "Badge", - "description": "Configure the following properties on the badge component.", - "isPublicDocs": true, + "description": "The badge custom element class that renders status indicators in the Shopify admin interface. This component displays compact visual indicators with customizable tones, sizes, and optional icons to communicate status information to merchants.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -121130,7 +135827,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -121139,7 +135836,7 @@ "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"strong\"", - "description": "Controls the visual weight and emphasis of the badge.\n\n- `base`: Standard weight with moderate emphasis, suitable for most use cases.\n- `strong`: Increased visual weight for higher emphasis and prominence.", + "description": "The visual weight of the badge. Available options: `'base'` for standard weight or `'strong'` for increased emphasis.", "defaultValue": "'base'", "isOptional": true }, @@ -121165,8 +135862,9 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the badge to provide additional visual context or reinforce the badge's meaning. Accepts any icon name from the icon library or a custom string identifier.", + "value": "\"\" | IconType", + "description": "The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''", "isOptional": true }, { @@ -121174,7 +135872,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -121192,7 +135890,7 @@ "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the badge.\n\n- `base`: Default size suitable for most badge use cases.\n- `large`: Larger badge for increased visibility and prominence.\n- `large-100`: Extra large badge for maximum visibility in emphasized contexts.", + "description": "The size of the badge. Available options: `'base'` for standard size, `'large'` for larger size, or `'large-100'` for extra large size.", "defaultValue": "'base'", "isOptional": true }, @@ -121201,18 +135899,32 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", + "description": "The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.", "defaultValue": "'auto'", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Badge extends PreactCustomElement implements BadgeProps {\n accessor color: BadgeProps['color'];\n accessor icon: BadgeProps['icon'];\n accessor size: BadgeProps['size'];\n accessor tone: BadgeProps['tone'];\n constructor();\n}" + "value": "declare class Badge extends BadgeBase implements BadgeProps {\n /**\n * The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: BadgeProps['icon'];\n /**\n * The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.\n */\n tone: BadgeProps['tone'];\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -121235,7 +135947,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -121243,7 +135955,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -121251,7 +135963,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -121259,11 +135971,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -121275,19 +135987,18 @@ "BadgeSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "BadgeSlots", - "description": "The badge component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The text label displayed within the badge component, typically a short status indicator or category label.", + "description": "The text content to display inside the badge. Typically a short status label like \"Fulfilled\", \"Draft\", or \"Active\".", "isOptional": true } ], - "value": "export interface BadgeSlots {\n /**\n * The text label displayed within the badge component, typically a short status indicator or category label.\n */\n children?: HTMLElement;\n}" + "value": "export interface BadgeSlots {\n /**\n * The text content to display inside the badge. Typically a short status label like \"Fulfilled\", \"Draft\", or \"Active\".\n */\n children?: HTMLElement;\n}" } } } @@ -121404,9 +136115,25 @@ "Banner": { "filePath": "src/surfaces/admin/components.ts", "name": "Banner", - "description": "Configure the following properties on the banner component.", - "isPublicDocs": true, + "description": "A custom element for displaying important messages and notifications.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -121430,7 +136157,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -121457,7 +136184,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dismissible", "value": "boolean", - "description": "Whether the banner displays a close button that allows users to dismiss it.\n\nWhen the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, any animation completes, and the `afterhide` event fires.", + "description": "Whether the banner can be dismissed by the user.", "defaultValue": "false", "isOptional": true }, @@ -121475,7 +136202,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Controls whether the banner is visible or hidden.\n\nWhen using a controlled component pattern and the banner is `dismissible`, update this property to `true` when the `dismiss` event fires.\n\nYou can hide the banner programmatically by setting this to `true` even if it's not `dismissible`.", + "description": "Whether the banner is hidden from view.", "defaultValue": "false", "isOptional": true }, @@ -121484,7 +136211,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -121502,18 +136229,25 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.", + "description": "The color tone of the banner based on its semantic meaning.", "defaultValue": "'auto'", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Banner extends PreactCustomElement implements BannerProps {\n accessor heading: BannerProps['heading'];\n accessor tone: BannerProps['tone'];\n accessor hidden: BannerProps['hidden'];\n accessor dismissible: BannerProps['dismissible'];\n constructor();\n}" + "value": "declare class Banner extends PolarisCustomElement implements BannerProps {\n /**\n * The heading text displayed at the top of the banner.\n */\n heading: BannerProps['heading'];\n /**\n * The color tone of the banner based on its semantic meaning.\n */\n tone: BannerProps['tone'];\n /**\n * Whether the banner is hidden from view.\n */\n hidden: BannerProps['hidden'];\n /**\n * Whether the banner can be dismissed by the user.\n */\n dismissible: BannerProps['dismissible'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -121536,7 +136270,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -121544,7 +136278,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -121552,7 +136286,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -121560,11 +136294,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -121576,15 +136310,14 @@ "BannerEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "BannerEvents", - "description": "The banner component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "afterhide", "value": "CallbackEventListener | null", - "description": "A callback fired after the banner is hidden.", + "description": "A callback that's fired after the banner finishes hiding.", "isOptional": true }, { @@ -121592,27 +136325,25 @@ "syntaxKind": "PropertySignature", "name": "dismiss", "value": "CallbackEventListener | null", - "description": "A callback fired when the banner is dismissed.", + "description": "A callback that's fired when the banner is dismissed.", "isOptional": true } ], - "value": "export interface BannerEvents {\n /**\n * A callback fired when the banner is dismissed.\n */\n dismiss: CallbackEventListener | null = null;\n /**\n * A callback fired after the banner is hidden.\n */\n afterhide: CallbackEventListener | null = null;\n}" + "value": "export interface BannerEvents {\n /**\n * A callback that's fired when the banner is dismissed.\n */\n dismiss: CallbackEventListener | null = null;\n /**\n * A callback that's fired after the banner finishes hiding.\n */\n afterhide: CallbackEventListener | null = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -121624,15 +136355,14 @@ "BannerSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "BannerSlots", - "description": "The banner component supports slots for additional content placement within the banner. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The main message content displayed within the banner component, providing important information or guidance to users.", + "description": "The content of the banner.", "isOptional": true }, { @@ -121640,11 +136370,11 @@ "syntaxKind": "PropertySignature", "name": "secondary-actions", "value": "HTMLElement", - "description": "Action buttons displayed at the bottom of the banner that let users respond to the message. Accepts up to two button components with `variant=\"secondary\"` or `variant=\"auto\"`.", + "description": "The secondary actions to display at the bottom of the banner. Only buttons with the `variant` of `'secondary'` or `'auto'` are allowed. A maximum of two `s-button` components can be provided.", "isOptional": true } ], - "value": "export interface BannerSlots {\n /**\n * The main message content displayed within the banner component, providing important information or guidance to users.\n */\n children?: HTMLElement;\n /**\n * Action buttons displayed at the bottom of the banner that let users respond to the message.\n * Accepts up to two button components with `variant=\"secondary\"` or `variant=\"auto\"`.\n */\n 'secondary-actions'?: HTMLElement;\n}" + "value": "export interface BannerSlots {\n /**\n * The content of the banner.\n */\n children?: HTMLElement;\n /**\n * The secondary actions to display at the bottom of the banner. Only buttons with the `variant` of `'secondary'` or `'auto'` are allowed. A maximum of two `s-button` components can be provided.\n */\n 'secondary-actions'?: HTMLElement;\n}" } } } @@ -121755,15 +136485,31 @@ "Box": { "filePath": "src/surfaces/admin/components.ts", "name": "Box", - "description": "Configure the following properties on the box component.", - "isPublicDocs": true, + "description": "A box is a container component that provides control over layout, spacing, and styling.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { @@ -121771,7 +136517,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'", "isOptional": true }, @@ -121780,7 +136526,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -121807,7 +136553,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'", "isOptional": true }, @@ -121816,7 +136562,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'", "isOptional": true }, @@ -121825,7 +136571,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -121846,7 +136592,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -121855,7 +136601,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'", "isOptional": true }, @@ -121864,7 +136610,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -121873,7 +136619,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -121882,7 +136628,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -121909,7 +136655,7 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'", "isOptional": true }, @@ -121918,7 +136664,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'", "isOptional": true }, @@ -121927,7 +136673,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -121936,7 +136682,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -121945,7 +136691,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -121954,7 +136700,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -121963,7 +136709,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'", "isOptional": true }, @@ -121972,7 +136718,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'", "isOptional": true }, @@ -121981,7 +136727,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -121990,7 +136736,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -121999,7 +136745,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -122008,7 +136754,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -122017,7 +136763,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -122026,7 +136772,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -122035,7 +136781,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -122047,6 +136793,14 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], "value": "declare class Box extends BoxElement implements BoxProps {\n constructor();\n}" @@ -122055,120 +136809,106 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -122176,14 +136916,13 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -122206,7 +136945,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -122214,7 +136953,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -122222,7 +136961,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -122230,11 +136969,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -122246,19 +136985,18 @@ "BoxSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "BoxSlots", - "description": "The box component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The content displayed within the box component, which serves as a flexible container for organizing and styling other components.", + "description": "The child elements to render inside the box.", "isOptional": true } ], - "value": "export interface BoxSlots {\n /**\n * The content displayed within the box component, which serves as a flexible container for organizing and styling other components.\n */\n children?: HTMLElement;\n}" + "value": "export interface BoxSlots {\n /**\n * The child elements to render inside the box.\n */\n children?: HTMLElement;\n}" } } } @@ -122392,15 +137130,31 @@ "Button": { "filePath": "src/surfaces/admin/components.ts", "name": "Button", - "description": "Configure the following properties on the button component.", - "isPublicDocs": true, + "description": "The button custom element class that renders interactive buttons in the Shopify admin interface. This component triggers actions or navigation when clicked, with customizable visual styles, states, and optional icons.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A text description of the button's purpose for screen readers. This is essential for accessibility when the button doesn't have visible text.", "isOptional": true }, { @@ -122426,7 +137180,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -122435,7 +137189,7 @@ "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'", "isOptional": true }, @@ -122444,7 +137198,7 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated.", + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated.", "isOptional": true }, { @@ -122461,7 +137215,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", + "description": "Whether the button is disabled, preventing any interaction. When `true`, the button appears visually disabled and doesn't respond to user clicks.", "defaultValue": "false", "isOptional": true }, @@ -122479,7 +137233,7 @@ "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", + "description": "Prompts the user to save the linked URL as a file with the specified filename. Only works when `href` is provided.", "isOptional": true }, { @@ -122487,15 +137241,25 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", + "description": "A URL that the button should navigate to when clicked. When provided, the button behaves as a link.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier.", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "inlineSize", + "value": "\"auto\" | \"fill\" | \"fit-content\"", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", + "defaultValue": "'auto'", "isOptional": true }, { @@ -122503,7 +137267,7 @@ "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated.", "isOptional": true }, { @@ -122511,7 +137275,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", + "description": "Whether the button is in a loading state. When `true`, displays a loading indicator and prevents interaction to show that an action is in progress.", "defaultValue": "false", "isOptional": true }, @@ -122520,7 +137284,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -122538,7 +137302,7 @@ "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to open the linked document when the button acts as a link. Available options: `''`, `'_blank'`, `'_self'`, `'_parent'`, or `'_top'`.", "defaultValue": "'auto'", "isOptional": true }, @@ -122547,7 +137311,7 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", + "description": "The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.", "defaultValue": "'auto'", "isOptional": true }, @@ -122556,35 +137320,48 @@ "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The button's behavior in forms. Available options: `'button'`, `'submit'`, or `'reset'`.", "defaultValue": "'button'", "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "variant", "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "defaultValue": "'auto'", + "description": "The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.", + "defaultValue": "'auto' - the variant is automatically determined by the Button's context", "isOptional": true } ], - "value": "declare class Button extends Button_base implements ButtonProps {\n accessor disabled: ButtonProps['disabled'];\n accessor icon: ButtonProps['icon'];\n accessor loading: ButtonProps['loading'];\n accessor variant: ButtonProps['variant'];\n accessor tone: ButtonProps['tone'];\n accessor target: ButtonProps['target'];\n accessor href: ButtonProps['href'];\n accessor download: ButtonProps['download'];\n accessor type: ButtonProps['type'];\n accessor accessibilityLabel: ButtonProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Button\n extends ButtonBase\n implements ButtonProps\n{\n /**\n * The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: ButtonProps['icon'];\n /**\n * The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.\n */\n variant: ButtonProps['variant'];\n /**\n * The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.\n */\n tone: ButtonProps['tone'];\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "AnyString": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AnyString", "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true + "description": "Prevents widening string literal types in a union to `string`." }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -122607,7 +137384,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -122615,7 +137392,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -122623,7 +137400,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -122631,11 +137408,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -122647,51 +137424,48 @@ "ButtonEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ButtonEvents", - "description": "The button component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", - "value": "CallbackEventListener | null", - "description": "A callback fired when the button loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "value": "CallbackEventListener | null", + "description": "A callback that's invoked when the button loses focus. Receives the blur event as an argument.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "click", - "value": "CallbackEventListener | null", - "description": "A callback fired when the button is clicked.\n\nLearn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", + "value": "CallbackEventListener | null", + "description": "A callback that's invoked when the button is clicked. Receives the click event as an argument.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "focus", - "value": "CallbackEventListener | null", - "description": "A callback fired when the button receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "value": "CallbackEventListener | null", + "description": "A callback that's invoked when the button receives focus. Receives the focus event as an argument.", "isOptional": true } ], - "value": "export interface ButtonEvents {\n /**\n * A callback fired when the button is clicked.\n *\n * Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n click: CallbackEventListener | null = null;\n /**\n * A callback fired when the button loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener | null = null;\n /**\n * A callback fired when the button receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener | null = null;\n}" + "value": "export interface ButtonEvents {\n /**\n * A callback that's invoked when the button is clicked. Receives the click event as an argument.\n */\n click: CallbackEventListener | null;\n /**\n * A callback that's invoked when the button loses focus. Receives the blur event as an argument.\n */\n blur: CallbackEventListener | null;\n /**\n * A callback that's invoked when the button receives focus. Receives the focus event as an argument.\n */\n focus: CallbackEventListener | null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -122703,19 +137477,18 @@ "ButtonSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ButtonSlots", - "description": "The button component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The label text or elements displayed inside the button component, describing the action that will be performed when clicked.", + "description": "The text label or content to display inside the button. Can be plain text or other components.", "isOptional": true } ], - "value": "export interface ButtonSlots {\n /**\n * The label text or elements displayed inside the button component, describing the action that will be performed when clicked.\n */\n children?: HTMLElement;\n}" + "value": "export interface ButtonSlots {\n /**\n * The text label or content to display inside the button. Can be plain text or other components.\n */\n children?: HTMLElement;\n}" } } } @@ -122945,15 +137718,31 @@ "ButtonGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "ButtonGroup", - "description": "Configure the following properties on the button group component.", - "isPublicDocs": true, + "description": "A button group that arranges multiple buttons together with consistent spacing and semantic grouping for related actions.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that's only visible to screen readers, describing the purpose of this group of buttons.", "isOptional": true }, { @@ -122979,7 +137768,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -122998,7 +137787,6 @@ "name": "disconnectedCallback", "value": "() => void", "description": "", - "isPrivate": true, "isOptional": true }, { @@ -123006,7 +137794,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "\"base\" | \"none\"", - "description": "The spacing between buttons in the group.\n\n- `base`: Standard spacing that provides clear visual separation between buttons.\n- `none`: No spacing, creating a connected button group.", + "description": "The amount of spacing between buttons in the group, affecting the visual separation of actions.", "defaultValue": "'base'", "isOptional": true }, @@ -123015,7 +137803,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -123027,15 +137815,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class ButtonGroup\n extends PreactCustomElement\n implements ButtonGroupProps\n{\n accessor gap: ButtonGroupProps['gap'];\n accessor accessibilityLabel: ButtonGroupProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class ButtonGroup extends ButtonGroupBase implements ButtonGroupProps {\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -123058,7 +137853,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -123066,7 +137861,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -123074,7 +137869,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -123082,11 +137877,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -123098,15 +137893,14 @@ "ButtonGroupSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ButtonGroupSlots", - "description": "The button group component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The buttons displayed within the button group component, which are arranged together as a cohesive set of related actions.", + "description": "The buttons that should be grouped together, provided as Button components.", "isOptional": true }, { @@ -123114,7 +137908,7 @@ "syntaxKind": "PropertySignature", "name": "primary-action", "value": "HTMLElement", - "description": "The main action for this group, displayed with high visual emphasis. Accepts a single button with `variant=\"primary\"`.\n\nUse this for the primary action you want users to take. This can't be used when `gap=\"none\"`.", + "description": "A single primary action button that's visually emphasized as the most important action in the group.\n\nAccepts a single Button element with a `variant` of `primary`. Can't be used when `gap` is set to `none`.", "isOptional": true }, { @@ -123122,11 +137916,11 @@ "syntaxKind": "PropertySignature", "name": "secondary-actions", "value": "HTMLElement", - "description": "Supporting actions displayed with less emphasis than the primary action. Accepts one or more button components with `variant=\"secondary\"` or `variant=\"auto\"`.\n\nUse these for alternative or less critical actions.", + "description": "One or more secondary action buttons that provide alternative or less prominent actions.\n\nAccepts Button elements with a `variant` of `secondary` or `auto`.", "isOptional": true } ], - "value": "export interface ButtonGroupSlots {\n /**\n * The buttons displayed within the button group component, which are arranged together as a cohesive set of related actions.\n */\n children?: HTMLElement;\n /**\n * The main action for this group, displayed with high visual emphasis.\n * Accepts a single button with `variant=\"primary\"`.\n *\n * Use this for the primary action you want users to take. This can't be used when `gap=\"none\"`.\n */\n 'primary-action'?: HTMLElement;\n /**\n * Supporting actions displayed with less emphasis than the primary action.\n * Accepts one or more button components with `variant=\"secondary\"` or `variant=\"auto\"`.\n *\n * Use these for alternative or less critical actions.\n */\n 'secondary-actions'?: HTMLElement;\n}" + "value": "export interface ButtonGroupSlots {\n /**\n * The buttons that should be grouped together, provided as Button components.\n */\n children?: HTMLElement;\n /**\n * A single primary action button that's visually emphasized as the most important action in the group.\n *\n * Accepts a single Button element with a `variant` of `primary`. Can't be used when `gap` is set to `none`.\n */\n 'primary-action'?: HTMLElement;\n /**\n * One or more secondary action buttons that provide alternative or less prominent actions.\n *\n * Accepts Button elements with a `variant` of `secondary` or `auto`.\n */\n 'secondary-actions'?: HTMLElement;\n}" } } } @@ -123254,24 +138048,40 @@ "Checkbox": { "filePath": "src/surfaces/admin/components.ts", "name": "Checkbox", - "description": "Configure the following properties on the checkbox component.", - "isPublicDocs": true, + "description": "A checkbox that lets users select or deselect an option, with support for an indeterminate state.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers.", "isOptional": true }, { @@ -123297,7 +138107,7 @@ "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false", "isOptional": true }, @@ -123306,7 +138116,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -123324,7 +138134,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false", "isOptional": true }, @@ -123333,7 +138143,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultIndeterminate", "value": "boolean", - "description": "The initial indeterminate state for uncontrolled components. Use this when you want the checkbox to start in an indeterminate state but don't need to control it afterward.\n\nThis value applies until `indeterminate` is explicitly set or the user changes the checkbox state by clicking.", + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered.", "defaultValue": "false", "isOptional": true }, @@ -123341,8 +138151,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -123350,7 +138160,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -123367,8 +138177,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -123385,7 +138195,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -123393,15 +138203,24 @@ "syntaxKind": "GetAccessor", "name": "indeterminate", "value": "boolean", - "description": "Whether the checkbox displays in an indeterminate state (neither checked nor unchecked), typically used to indicate partial selection in hierarchical lists.\n\nThis visual state takes priority over the `checked` prop in appearance only. The form submission value is still determined by the `checked` prop.\n\nIf `indeterminate` has not been explicitly set and hasn't been modified by user interaction, it returns the value of `defaultIndeterminate`.", + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state.", + "value": "any", + "description": "Visual content to use as the control label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "labelAccessibilityVisibility", + "value": "\"visible\" | \"exclusive\"", + "description": "", + "defaultValue": "'visible'", "isOptional": true }, { @@ -123409,7 +138228,15 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "", "isOptional": true }, { @@ -123417,7 +138244,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -123439,6 +138266,14 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -123448,13 +138283,19 @@ "isOptional": true } ], - "value": "declare class Checkbox extends PreactCheckboxElement implements CheckboxProps {\n get indeterminate(): CheckboxProps['indeterminate'];\n set indeterminate(indeterminate: CheckboxProps['indeterminate']);\n accessor defaultIndeterminate: CheckboxProps['defaultIndeterminate'];\n constructor();\n}" + "value": "declare class Checkbox extends CheckboxBase implements CheckboxProps {\n constructor();\n}" + }, + "CallbackEvent": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CallbackEvent", + "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -123477,7 +138318,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -123485,7 +138326,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -123493,7 +138334,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -123501,11 +138342,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -123517,15 +138358,22 @@ "CheckboxEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "CheckboxEvents", - "description": "The checkbox component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "blur", + "value": "CallbackEventListener<'input'>", + "description": "", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the checkbox value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -123533,27 +138381,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the checkbox.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface CheckboxEvents {\n /**\n * A callback fired when the checkbox value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the checkbox.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n}" + "value": "export interface CheckboxEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -123709,15 +138555,31 @@ "Chip": { "filePath": "src/surfaces/admin/components.ts", "name": "Chip", - "description": "Configure the following properties on the chip component.", - "isPublicDocs": true, + "description": "", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers.", "isOptional": true }, { @@ -123743,7 +138605,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -123752,7 +138614,7 @@ "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "Modify the color to be more or less intense.", "defaultValue": "'base'", "isOptional": true }, @@ -123779,10 +138641,19 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", + "defaultValue": "false", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -123791,23 +138662,29 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Chip extends PreactCustomElement implements ChipProps {\n accessor color: ChipProps['color'];\n accessor accessibilityLabel: ChipProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Chip extends PolarisCustomElement implements ChipProps {\n color: ChipProps['color'];\n accessibilityLabel: ChipProps['accessibilityLabel'];\n removable: ChipProps['removable'];\n constructor(renderImpl?: Omit);\n}" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -123830,7 +138707,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -123838,7 +138715,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -123846,7 +138723,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -123854,11 +138731,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -123870,15 +138747,14 @@ "ChipSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ChipSlots", - "description": "The chip component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The text label displayed within the chip component, typically representing a selected filter, tag, or removable item.", + "description": "The content of the chip.", "isOptional": true }, { @@ -123886,11 +138762,11 @@ "syntaxKind": "PropertySignature", "name": "graphic", "value": "HTMLElement", - "description": "An optional icon to display at the start of the chip. Accepts only icon components.", + "description": "An optional icon to display at the start of the chip. Accepts only Icon components.", "isOptional": true } ], - "value": "export interface ChipSlots {\n /**\n * The text label displayed within the chip component, typically representing a selected filter, tag, or removable item.\n */\n children?: HTMLElement;\n /**\n * An optional icon to display at the start of the chip. Accepts only icon components.\n */\n graphic?: HTMLElement;\n}" + "value": "export interface ChipSlots {\n /**\n * The content of the chip.\n */\n children?: HTMLElement;\n /**\n * An optional icon to display at the start of the chip. Accepts only Icon components.\n */\n graphic?: HTMLElement;\n}" } } } @@ -124007,18 +138883,43 @@ "ChoiceList": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceList", - "description": "Configure the following properties on the choice list component.", - "isPublicDocs": true, + "description": "A list of choices that lets users select one or more options using radio buttons or checkboxes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$3@11434", + "name": "__@internals$3@16769", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "addEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", + "description": "Wraps change and input event listeners so they only fire when the event was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n\nThis prevents form events from elements inside secondary content (e.g. TextField, native ) from being mistakenly treated as ChoiceList value-change events, while still allowing those events to bubble normally through the DOM (preserving React's event delegation).", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -124042,7 +138943,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -124059,8 +138960,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the choice list.", "isOptional": true }, { @@ -124068,7 +138969,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction. When `true`, the `disabled` property on any child choices is ignored.", + "description": "Whether all choices in the list are disabled and can't be selected.", "defaultValue": "false", "isOptional": true }, @@ -124085,8 +138986,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "An error message that's displayed below the choice list when validation fails.", "isOptional": true }, { @@ -124102,8 +139003,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "The text that describes what the choice list is for.", "isOptional": true }, { @@ -124111,7 +139012,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'", "isOptional": true }, @@ -124120,7 +139021,7 @@ "syntaxKind": "PropertyDeclaration", "name": "multiple", "value": "boolean", - "description": "Whether multiple choices can be selected.", + "description": "Whether users can select more than one choice at a time.", "defaultValue": "false", "isOptional": true }, @@ -124129,7 +139030,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "The name that identifies this choice list when the form is submitted.", "isOptional": true }, { @@ -124137,7 +139038,16 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "removeEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", + "description": "", "isPrivate": true, "isOptional": true }, @@ -124150,22 +139060,29 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "values", "value": "string[]", - "description": "An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected.", + "description": "The values of the currently selected choices.", "isOptional": true } ], - "value": "declare class ChoiceList extends BaseClass$3 implements ChoiceListProps {\n accessor disabled: ChoiceListProps['disabled'];\n accessor name: ChoiceListProps['name'];\n accessor error: ChoiceListProps['error'];\n accessor details: ChoiceListProps['details'];\n accessor multiple: ChoiceListProps['multiple'];\n accessor label: ChoiceListProps['label'];\n accessor labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class ChoiceList extends BaseClass$1 implements ChoiceListProps {\n /**\n * Wraps change and input event listeners so they only fire when the event\n * was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n *\n * This prevents form events from elements inside secondary content (e.g.\n * TextField, native ) from being mistakenly treated as ChoiceList\n * value-change events, while still allowing those events to bubble normally\n * through the DOM (preserving React's event delegation).\n * @private\n */\n addEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n\n /** @private */\n removeEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: EventListenerOptions | boolean,\n ): void;\n\n /**\n * Whether all choices in the list are disabled and can't be selected.\n */\n disabled: ChoiceListProps['disabled'];\n /**\n * The name that identifies this choice list when the form is submitted.\n */\n name: ChoiceListProps['name'];\n /**\n * An error message that's displayed below the choice list when validation fails.\n */\n error: ChoiceListProps['error'];\n /**\n * Additional text to provide context or guidance for the choice list.\n */\n details: ChoiceListProps['details'];\n /**\n * Whether users can select more than one choice at a time.\n */\n multiple: ChoiceListProps['multiple'];\n /**\n * The text that describes what the choice list is for.\n */\n label: ChoiceListProps['label'];\n /**\n * Controls whether the label is visible to all users or only to screen readers.\n */\n labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n /**\n * The values of the currently selected choices.\n */\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -124188,7 +139105,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -124196,7 +139113,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -124204,7 +139121,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -124212,11 +139129,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -124228,15 +139145,14 @@ "ChoiceListEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceListEvents", - "description": "The choice list component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener | null", - "description": "A callback fired when the choice list selection changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "A callback that's triggered when the selected choices change and the choice list loses focus.", "isOptional": true }, { @@ -124244,27 +139160,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener | null", - "description": "A callback fired when the user inputs data into the choice list.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "A callback that's triggered when the selected choices change.", "isOptional": true } ], - "value": "export interface ChoiceListEvents {\n /**\n * A callback fired when the choice list selection changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener | null = null;\n /**\n * A callback fired when the user inputs data into the choice list.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener | null = null;\n}" + "value": "export interface ChoiceListEvents {\n /**\n * A callback that's triggered when the selected choices change and the choice list loses focus.\n */\n change: CallbackEventListener | null = null;\n /**\n * A callback that's triggered when the selected choices change.\n */\n input: CallbackEventListener | null = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -124276,15 +139190,31 @@ "Choice": { "filePath": "src/surfaces/admin/components.ts", "name": "Choice", - "description": "The choice component creates individual selectable options within a choice list. Use choice to define each option that merchants can select, supporting both single selection (radio buttons) and multiple selection (checkboxes) modes.\n\nChoice components support labels, help text, and custom content through slots, providing flexible option presentation within choice lists.", - "isPublicDocs": true, + "description": "A single choice within a choice list that can be selected with a radio button or checkbox.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that's only visible to screen readers, used when the visual label isn't descriptive enough.", "isOptional": true }, { @@ -124310,7 +139240,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -124328,7 +139258,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the choice should be selected when it's first rendered.", "defaultValue": "false", "isOptional": true }, @@ -124337,7 +139267,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the choice is disabled and can't be selected.", "defaultValue": "false", "isOptional": true }, @@ -124355,7 +139285,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -124364,7 +139294,7 @@ "syntaxKind": "GetAccessor", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the choice is currently selected.", "defaultValue": "false", "isOptional": true }, @@ -124377,22 +139307,29 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\".", + "description": "The value that's submitted with the form when this choice is selected.", "isOptional": true } ], - "value": "declare class Choice extends PreactCustomElement implements ChoiceProps {\n accessor disabled: ChoiceProps['disabled'];\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n accessor value: ChoiceProps['value'];\n accessor accessibilityLabel: ChoiceProps['accessibilityLabel'];\n accessor defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Choice extends PolarisCustomElement implements ChoiceProps {\n /**\n * Whether the choice is disabled and can't be selected.\n */\n disabled: ChoiceProps['disabled'];\n /**\n * Whether the choice is currently selected.\n */\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n /**\n * The value that's submitted with the form when this choice is selected.\n */\n value: ChoiceProps['value'];\n /**\n * A label that's only visible to screen readers, used when the visual label isn't descriptive enough.\n */\n accessibilityLabel: ChoiceProps['accessibilityLabel'];\n /**\n * Whether the choice should be selected when it's first rendered.\n */\n defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -124415,7 +139352,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -124423,7 +139360,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -124431,7 +139368,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -124439,11 +139376,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -124455,15 +139392,14 @@ "ChoiceSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceSlots", - "description": "The choice list component supports slots for additional content placement within each choice. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The label text or elements that identify this selectable choice to users.\n\nThe label is produced by extracting and concatenating the text nodes from the provided content; any markup or element structure is ignored.", + "description": "The content that's used as the choice label, extracted as plain text from any provided markup.\n\nThe label is produced by extracting and concatenating the text nodes from the provided content; any markup or element structure is ignored.", "isOptional": true }, { @@ -124471,11 +139407,19 @@ "syntaxKind": "PropertySignature", "name": "details", "value": "HTMLElement", - "description": "Additional text to provide context or guidance for the input.\n\nThis text is displayed along with the input and its label to offer more information or instructions to the user.", + "description": "Additional text that provides context or guidance for the input, displayed alongside the choice label.\n\nThis text is displayed along with the input and its label to offer more information or instructions to the user.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "secondary-content", + "value": "HTMLElement", + "description": "Additional content to display below the choice label. Can include rich content like TextFields, Buttons, or other interactive components. Event handlers on React components are preserved.", "isOptional": true } ], - "value": "export interface ChoiceSlots {\n /**\n * The label text or elements that identify this selectable choice to users.\n *\n * The label is produced by extracting and\n * concatenating the text nodes from the provided content;\n * any markup or element structure is ignored.\n */\n children?: HTMLElement;\n /**\n * Additional text to provide context or guidance for the input.\n *\n * This text is displayed along with the input and its label\n * to offer more information or instructions to the user.\n *\n * @implementation this content should be linked to the input with an `aria-describedby` attribute.\n */\n details?: HTMLElement;\n}" + "value": "export interface ChoiceSlots {\n /**\n * The content that's used as the choice label, extracted as plain text from any provided markup.\n *\n * The label is produced by extracting and concatenating the text nodes from the provided content; any markup or element structure is ignored.\n */\n children?: HTMLElement;\n /**\n * Additional text that provides context or guidance for the input, displayed alongside the choice label.\n *\n * This text is displayed along with the input and its label to offer more information or instructions to the user.\n *\n * @implementation this content should be linked to the input with an `aria-describedby` attribute.\n */\n details?: HTMLElement;\n /**\n * Additional content to display below the choice label.\n * Can include rich content like TextFields, Buttons, or other interactive components.\n * Event handlers on React components are preserved.\n */\n 'secondary-content'?: HTMLElement;\n}" } } } @@ -124603,15 +139547,31 @@ "Clickable": { "filePath": "src/surfaces/admin/components.ts", "name": "Clickable", - "description": "Configure the following properties on the clickable component.", - "isPublicDocs": true, + "description": "", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { @@ -124619,7 +139579,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'", "isOptional": true }, @@ -124628,7 +139588,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -124655,7 +139615,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'", "isOptional": true }, @@ -124664,7 +139624,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'", "isOptional": true }, @@ -124673,7 +139633,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -124694,7 +139654,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -124703,7 +139663,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'", "isOptional": true }, @@ -124712,7 +139672,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -124721,7 +139681,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -124730,7 +139690,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -124739,7 +139699,7 @@ "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'", "isOptional": true }, @@ -124748,7 +139708,7 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated.", + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated.", "isOptional": true }, { @@ -124765,7 +139725,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the component is disabled, preventing clicks and focus. When disabled, the `click` event won't fire and click events from child elements stop propagating immediately. Interactive child elements can still receive focus and be interacted with. This doesn't apply visual styling by default. You shouldapply disabled styling as needed.", + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly.", "isOptional": true }, { @@ -124782,7 +139742,7 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'", "isOptional": true }, @@ -124791,7 +139751,7 @@ "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", "isOptional": true }, { @@ -124799,7 +139759,7 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { @@ -124807,7 +139767,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'", "isOptional": true }, @@ -124816,7 +139776,7 @@ "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated.", "isOptional": true }, { @@ -124824,7 +139784,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the component is in a loading state, which indicates to assistive technology that an action is in progress and prevents interaction.", + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable.", "isOptional": true }, { @@ -124832,7 +139792,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -124841,7 +139801,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -124850,7 +139810,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -124859,7 +139819,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -124868,7 +139828,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'", "isOptional": true }, @@ -124877,7 +139837,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'", "isOptional": true }, @@ -124886,7 +139846,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -124895,7 +139855,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -124904,7 +139864,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -124913,7 +139873,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -124922,7 +139882,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -124931,7 +139891,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -124940,7 +139900,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -124958,7 +139918,7 @@ "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'", "isOptional": true }, @@ -124967,139 +139927,132 @@ "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "defaultValue": "'button'", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n accessor disabled: ClickableProps['disabled'];\n accessor loading: ClickableProps['loading'];\n accessor target: ClickableProps['target'];\n accessor href: ClickableProps['href'];\n accessor download: ClickableProps['download'];\n accessor type: ClickableProps['type'];\n constructor();\n}" + "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n disabled: ClickableProps['disabled'];\n loading: ClickableProps['loading'];\n target: ClickableProps['target'];\n href: ClickableProps['href'];\n download: ClickableProps['download'];\n type: ClickableProps['type'];\n constructor();\n}" }, "AnyString": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AnyString", "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true + "description": "Prevents widening string literal types in a union to `string`." }, "AccessibilityRole": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -125107,14 +140060,13 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -125137,7 +140089,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -125145,7 +140097,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -125153,7 +140105,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -125161,11 +140113,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -125177,15 +140129,14 @@ "ClickableEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableEvents", - "description": "The clickable component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener | null", - "description": "A callback fired when the component loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -125193,7 +140144,7 @@ "syntaxKind": "PropertySignature", "name": "click", "value": "CallbackEventListener | null", - "description": "A callback fired when the component is clicked.\n\nLearn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", + "description": "", "isOptional": true }, { @@ -125201,27 +140152,25 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener | null", - "description": "A callback fired when the component receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true } ], - "value": "export interface ClickableEvents {\n /**\n * A callback fired when the component is clicked.\n *\n * Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n click: CallbackEventListener | null = null;\n /**\n * A callback fired when the component loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener | null = null;\n /**\n * A callback fired when the component receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener | null = null;\n}" + "value": "export interface ClickableEvents {\n click: CallbackEventListener | null = null;\n blur: CallbackEventListener | null = null;\n focus: CallbackEventListener | null = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -125233,19 +140182,18 @@ "ClickableSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableSlots", - "description": "The clickable component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The content displayed within the clickable component, which makes any content interactive and clickable without the semantic meaning of a button or link.", + "description": "The content to display inside the component. This can include text, components, or any other UI elements.", "isOptional": true } ], - "value": "export interface ClickableSlots {\n /**\n * The content displayed within the clickable component, which makes any content interactive and clickable without the semantic meaning of a button or link.\n */\n children?: HTMLElement;\n}" + "value": "export interface ClickableSlots {\n /**\n * The content to display inside the component. This can include text, components, or any other UI elements.\n */\n children?: HTMLElement;\n}" } } } @@ -125390,15 +140338,31 @@ "ClickableChip": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChip", - "description": "Configure the following properties on the clickable chip component.", - "isPublicDocs": true, + "description": "A custom element for displaying interactive chips that can be clicked or removed.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A text description of the chip for screen readers.", "isOptional": true }, { @@ -125424,7 +140388,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -125433,7 +140397,7 @@ "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "The color of the chip.", "defaultValue": "'base'", "isOptional": true }, @@ -125442,7 +140406,7 @@ "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'", "isOptional": true }, @@ -125451,7 +140415,7 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated.", + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated.", "isOptional": true }, { @@ -125468,7 +140432,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the chip is disabled, preventing any user interaction.", + "description": "Whether the chip is disabled and can't be clicked.", "defaultValue": "false", "isOptional": true }, @@ -125486,7 +140450,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Whether the chip is hidden from view. When using controlled component pattern with `removable` chips, update this property when the `remove` event fires. For non-removable chips, manually toggle this property to show or hide the chip.", + "description": "Whether the chip is hidden from view.", "defaultValue": "false", "isOptional": true }, @@ -125495,7 +140459,7 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", + "description": "The URL to navigate to when the chip is clicked.", "isOptional": true }, { @@ -125503,7 +140467,7 @@ "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated.", "isOptional": true }, { @@ -125511,7 +140475,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -125520,7 +140484,7 @@ "syntaxKind": "PropertyDeclaration", "name": "removable", "value": "boolean", - "description": "Whether the chip displays a remove button for dismissal. When clicked, the `remove` callback fires.", + "description": "Whether the chip can be removed by the user.", "defaultValue": "false", "isOptional": true }, @@ -125532,23 +140496,29 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class ClickableChip\n extends ClickableChip_base\n implements ClickableChipProps\n{\n accessor color: ClickableChipProps['color'];\n accessor accessibilityLabel: ClickableChipProps['accessibilityLabel'];\n accessor removable: ClickableChipProps['removable'];\n accessor hidden: ClickableChipProps['hidden'];\n accessor disabled: ClickableChipProps['disabled'];\n accessor href: ClickableChipProps['href'];\n constructor();\n}" + "value": "declare class ClickableChip\n extends ClickableChipBase\n implements ClickableChipProps\n{\n /**\n * The color of the chip.\n */\n color: ClickableChipProps['color'];\n constructor();\n}" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -125571,7 +140541,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -125579,7 +140549,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -125587,7 +140557,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -125595,11 +140565,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -125611,51 +140581,48 @@ "ClickableChipEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChipEvents", - "description": "The clickable chip component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "afterhide", - "value": "CallbackEventListener | null", - "description": "A callback fired after the chip is hidden.", + "value": "CallbackEventListener | null", + "description": "A callback that's fired after the chip finishes hiding.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "click", - "value": "CallbackEventListener | null", - "description": "A callback fired when the chip is clicked.\n\nLearn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", + "value": "CallbackEventListener | null", + "description": "A callback that's fired when the chip is clicked.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "remove", - "value": "CallbackEventListener | null", - "description": "A callback fired when the chip is removed.", + "value": "CallbackEventListener | null", + "description": "A callback that's fired when the chip is removed.", "isOptional": true } ], - "value": "export interface ClickableChipEvents {\n /**\n * A callback fired when the chip is clicked.\n *\n * Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n click: CallbackEventListener | null = null;\n /**\n * A callback fired when the chip is removed.\n */\n remove: CallbackEventListener | null = null;\n /**\n * A callback fired after the chip is hidden.\n */\n afterhide: CallbackEventListener | null = null;\n}" + "value": "export interface ClickableChipEvents {\n /**\n * A callback that's fired when the chip is clicked.\n */\n click: CallbackEventListener | null;\n /**\n * A callback that's fired when the chip is removed.\n */\n remove: CallbackEventListener | null;\n /**\n * A callback that's fired after the chip finishes hiding.\n */\n afterhide: CallbackEventListener | null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -125667,15 +140634,14 @@ "ClickableChipSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChipSlots", - "description": "The clickable chip component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The text label displayed within the chip, which represents an interactive filter, tag, or selectable item.", + "description": "The content of the chip.", "isOptional": true }, { @@ -125683,11 +140649,11 @@ "syntaxKind": "PropertySignature", "name": "graphic", "value": "HTMLElement", - "description": "An optional icon to display at the start of the chip. Accepts only icon components.", + "description": "An optional icon to display at the start of the chip. Accepts only Icon components.", "isOptional": true } ], - "value": "export interface ClickableChipSlots {\n /**\n * The text label displayed within the chip, which represents an interactive filter, tag, or selectable item.\n */\n children?: HTMLElement;\n /**\n * An optional icon to display at the start of the chip. Accepts only icon components.\n */\n graphic?: HTMLElement;\n}" + "value": "export interface ClickableChipSlots {\n /**\n * The content of the chip.\n */\n children?: HTMLElement;\n /**\n * An optional icon to display at the start of the chip. Accepts only Icon components.\n */\n graphic?: HTMLElement;\n}" } } } @@ -125821,18 +140787,34 @@ "ColorField": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorField", - "description": "Configure the following properties on the color field component.", - "isPublicDocs": true, + "description": "The color field custom element class that renders a color input field with integrated visual picker in the Shopify admin interface. This component allows merchants to select colors by typing hex values or using an interactive color picker, with optional support for transparency (alpha channel).", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -125847,7 +140829,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false", "isOptional": true }, @@ -125865,7 +140847,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\"", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else", "isOptional": true }, @@ -125874,7 +140856,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -125892,15 +140874,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -125908,7 +140890,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -125925,8 +140907,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -125961,7 +140943,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -125969,7 +140951,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -125977,8 +140959,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -125986,7 +140968,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -125995,7 +140977,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -126003,7 +140985,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -126011,7 +140993,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -126020,7 +141002,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -126029,7 +141011,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -126051,22 +141033,29 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format.", + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).", "isOptional": true } ], - "value": "declare class ColorField\n extends PreactFieldElement\n implements ColorFieldProps\n{\n accessor alpha: ColorFieldProps['alpha'];\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n setInternalValue(value: string, normalize: boolean): void;\n}" + "value": "declare class ColorField extends ColorFieldBase implements ColorFieldProps {\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -126089,7 +141078,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -126097,7 +141086,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -126105,7 +141094,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -126113,11 +141102,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -126129,15 +141118,14 @@ "ColorFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorFieldEvents", - "description": "The color field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the color field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -126145,7 +141133,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the color field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -126153,7 +141141,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the color field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -126161,27 +141149,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the color field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface ColorFieldEvents {\n /**\n * A callback fired when the color field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the color field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the color field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the color field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface ColorFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -126388,112 +141374,40 @@ "ColorPicker": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorPicker", - "description": "Configure the following properties on the color picker component.", - "isPublicDocs": true, + "description": "A visual color picker component that allows users to select colors from a color spectrum interface.", "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@internals$2@11535", - "value": "ElementInternals", - "description": "", - "isPrivate": true, - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true, - "isOptional": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false", "isOptional": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true, - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true, - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true, - "isOptional": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial color value when the field first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts interacting, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", + "name": "formResetCallback", "value": "() => void", "description": "", "isPrivate": true, "isOptional": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "formResetCallback", - "value": "() => void", - "description": "A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`.", - "isOptional": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true, - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true, + "description": "The name of the picker, used when submitting form data.", "isOptional": true }, { @@ -126501,68 +141415,11 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format.", - "isOptional": true - } - ], - "value": "declare class ColorPicker extends BaseClass$2 implements ColorPickerProps {\n accessor alpha: boolean;\n accessor name: string;\n accessor defaultValue: string;\n get value(): string;\n set value(value: string);\n /**\n * A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`.\n */\n formResetCallback(): void;\n constructor();\n}" - }, - "ClickOptions": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ClickOptions", - "description": "", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "sourceEvent", - "value": "ActivationEventEsque", - "description": "The event you want to influence the synthetic click.", + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).", "isOptional": true } ], - "value": "export interface ClickOptions {\n /**\n * The event you want to influence the synthetic click.\n */\n sourceEvent?: ActivationEventEsque;\n}" - }, - "ActivationEventEsque": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ActivationEventEsque", - "description": "", - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "button", - "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "ctrlKey", - "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "metaKey", - "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "shiftKey", - "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", - "isOptional": true - } - ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "declare class ColorPicker extends BaseClass implements ColorPickerProps {\n /**\n * Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.\n *\n * @default false\n */\n alpha: boolean;\n /**\n * The name of the picker, used when submitting form data.\n */\n name: string;\n /**\n * The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n defaultValue: string;\n /**\n * The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n}" } } }, @@ -126574,15 +141431,14 @@ "ColorPickerEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorPickerEvents", - "description": "The color picker component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener | null", - "description": "A callback fired when the color picker value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "The callback that's triggered when the selected color changes and the picker loses focus.", "isOptional": true }, { @@ -126590,27 +141446,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener | null", - "description": "A callback fired when the user inputs data into the color picker.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "The callback that's triggered when the selected color changes as the user interacts with the picker.", "isOptional": true } ], - "value": "export interface ColorPickerEvents {\n /**\n * A callback fired when the color picker value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener | null = null;\n /**\n * A callback fired when the user inputs data into the color picker.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener | null = null;\n}" + "value": "export interface ColorPickerEvents {\n /**\n * The callback that's triggered when the selected color changes and the picker loses focus.\n */\n change: CallbackEventListener | null = null;\n /**\n * The callback that's triggered when the selected color changes as the user interacts with the picker.\n */\n input: CallbackEventListener | null = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -126687,18 +141541,34 @@ "DateField": { "filePath": "src/surfaces/admin/components.ts", "name": "DateField", - "description": "Configure the following properties on the date field component.", - "isPublicDocs": true, + "description": "The date field custom element class that renders a date input field with integrated calendar picker in the Shopify admin interface. This component allows merchants to select dates by typing or using a visual calendar, with support for date range restrictions and day-of-week constraints.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -126713,8 +141583,20 @@ "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ], "isOptional": true }, { @@ -126722,8 +141604,20 @@ "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ], "isOptional": true }, { @@ -126740,7 +141634,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "DateAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else", "isOptional": true }, @@ -126749,7 +141643,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -126767,8 +141661,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "defaultValue": "\"\"", + "description": "The default value for the field.", "isOptional": true }, { @@ -126776,15 +141669,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale.", + "description": "The initial month and year shown when the calendar picker first opens, formatted as an ISO 8601 date string.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -126792,7 +141685,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -126801,8 +141694,20 @@ "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ], "isOptional": true }, { @@ -126810,8 +141715,20 @@ "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ], "isOptional": true }, { @@ -126827,8 +141744,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -126863,7 +141780,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -126871,7 +141788,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -126879,8 +141796,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -126888,7 +141805,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -126897,7 +141814,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -126905,7 +141822,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -126913,7 +141830,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -126922,7 +141839,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -126931,7 +141848,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -126944,13 +141861,20 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected date in `YYYY-MM-DD` format. An empty string means no date is selected.", - "defaultValue": "\"\"", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true }, { @@ -126958,25 +141882,23 @@ "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`.", + "description": "The currently visible month and year in the calendar picker, formatted as an ISO 8601 date string.", "isOptional": true } ], - "value": "declare class DateField\n extends PreactFieldElement\n implements DateFieldProps\n{\n accessor allow: DateFieldProps['allow'];\n accessor disallow: DateFieldProps['disallow'];\n accessor allowDays: DateFieldProps['allowDays'];\n accessor disallowDays: DateFieldProps['disallowDays'];\n set view(view: string);\n get view(): string;\n accessor defaultView: DateFieldProps['defaultView'];\n constructor();\n}" + "value": "declare class DateField extends DateFieldBase implements DateFieldProps {\n constructor();\n}" }, "DateAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "DateAutocompleteField", "value": "'bday-day' | 'bday-month' | 'bday-year' | 'bday' | 'cc-expiry-month' | 'cc-expiry-year' | 'cc-expiry'", - "description": "Represents autocomplete values that are valid for date input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for date-based inputs.\n\nAvailable values:\n- `bday` - Complete birthday date\n- `bday-day` - Day component of a birthday (1-31)\n- `bday-month` - Month component of a birthday (1-12)\n- `bday-year` - Year component of a birthday (1990)\n- `cc-expiry` - Complete credit card expiration date\n- `cc-expiry-month` - Month component of a credit card expiration date (1-12)\n- `cc-expiry-year` - Year component of a credit card expiration date (2025)", - "isPublicDocs": true + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -126999,7 +141921,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -127007,7 +141929,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -127015,7 +141937,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -127023,11 +141945,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -127039,15 +141961,14 @@ "DateFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "DateFieldEvents", - "description": "The date field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the date field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -127055,7 +141976,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the date field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -127063,7 +141984,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the date field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -127071,43 +141992,41 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the date field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "invalid", - "value": "CallbackEventListener | null", - "description": "A callback fired when the date field value is invalid.\n\nLearn more about the [invalid event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/invalid_event).", + "value": "CallbackEventListener<'s-date-field'> | null", + "description": "The callback that's triggered when the user attempts to enter an invalid date.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "viewchange", - "value": "CallbackEventListener | null", - "description": "A callback fired when the calendar view changes (such as when navigating between months).", + "value": "CallbackEventListener<'s-date-field'> | null", + "description": "The callback that's triggered when the visible month or year in the calendar changes.", "isOptional": true } ], - "value": "export interface DateFieldEvents {\n /**\n * A callback fired when the date field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the date field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the date field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the date field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n /**\n * A callback fired when the calendar view changes (such as when navigating between months).\n */\n viewchange: CallbackEventListener | null = null;\n /**\n * A callback fired when the date field value is invalid.\n *\n * Learn more about the [invalid event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/invalid_event).\n */\n invalid: CallbackEventListener | null = null;\n}" + "value": "export interface DateFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n /**\n * The callback that's triggered when the visible month or year in the calendar changes.\n */\n viewchange: CallbackEventListener<'s-date-field'> | null;\n /**\n * The callback that's triggered when the user attempts to enter an invalid date.\n */\n invalid: CallbackEventListener<'s-date-field'> | null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -127320,27 +142239,43 @@ "DatePicker": { "filePath": "src/surfaces/admin/components.ts", "name": "DatePicker", - "description": "Configure the following properties on the date picker component.", - "isPublicDocs": true, + "description": "The date picker custom element class that renders a standalone calendar interface in the Shopify admin. This component allows merchants to select single dates or date ranges using an interactive calendar with month/year navigation, date constraints, and day-of-week restrictions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@dirtyStateSymbol@11579", + "name": "__@dirtyStateSymbol@16932", "value": "boolean", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$1@11578", + "name": "__@internals$1@16931", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -127355,8 +142290,20 @@ "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ], "isOptional": true }, { @@ -127364,8 +142311,20 @@ "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ], "isOptional": true }, { @@ -127382,7 +142341,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -127400,7 +142359,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initially selected date(s) when the component first renders. An empty string means no date is initially selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The initial selected date or date range when the picker first renders, formatted as an ISO 8601 date string.", "defaultValue": "\"\"", "isOptional": true }, @@ -127409,7 +142368,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale.", + "description": "The initial month and year shown when the calendar first renders, formatted as an ISO 8601 date string.", "isOptional": true }, { @@ -127417,8 +142376,20 @@ "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ], "isOptional": true }, { @@ -127426,8 +142397,20 @@ "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ], "isOptional": true }, { @@ -127453,7 +142436,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "The name of the picker, used when submitting form data.", "isOptional": true }, { @@ -127461,7 +142444,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -127479,16 +142462,24 @@ "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"single\" | \"range\"", - "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "description": "The type of date selection allowed. Available values: `single`, `range`.", "defaultValue": "\"single\"", "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "value", "value": "string", - "description": "The currently selected date(s). An empty string means no date is selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The currently selected date or date range, formatted as an ISO 8601 date string.", "defaultValue": "\"\"", "isOptional": true }, @@ -127497,17 +142488,16 @@ "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`.", + "description": "The currently visible month and year in the calendar, formatted as an ISO 8601 date string.", "isOptional": true } ], - "value": "declare class DatePicker extends BaseClass$1 implements DatePickerProps {\n accessor defaultView: string;\n set view(view: string);\n get view(): string;\n accessor allow: DatePickerProps['allow'];\n accessor disallow: DatePickerProps['disallow'];\n accessor allowDays: DatePickerProps['allowDays'];\n accessor disallowDays: DatePickerProps['disallowDays'];\n accessor type: DatePickerProps['type'];\n accessor defaultValue: DatePickerProps['defaultValue'];\n accessor name: DatePickerProps['name'];\n set value(value: string);\n get value(): string;\n /** @private */\n [dirtyStateSymbol]: boolean;\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DatePicker\n extends DatePickerBase\n implements DatePickerProps\n{\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -127530,7 +142520,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -127538,7 +142528,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -127546,7 +142536,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -127554,11 +142544,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -127570,67 +142560,64 @@ "DatePickerEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "DatePickerEvents", - "description": "The date picker component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", - "value": "CallbackEventListener | null", - "description": "A callback fired when the date picker loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "value": "CallbackEventListener | null", + "description": "The callback that's triggered when the picker loses focus.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "change", - "value": "CallbackEventListener | null", - "description": "A callback fired when the date picker value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "value": "CallbackEventListener | null", + "description": "The callback that's triggered when the selected date changes and the picker loses focus.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "focus", - "value": "CallbackEventListener | null", - "description": "A callback fired when the date picker receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "value": "CallbackEventListener | null", + "description": "The callback that's triggered when the picker receives focus.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "input", - "value": "CallbackEventListener | null", - "description": "A callback fired when the user inputs data into the date picker.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "value": "CallbackEventListener | null", + "description": "The callback that's triggered when the selected date changes as the user interacts with the picker.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "viewchange", - "value": "CallbackEventListener | null", - "description": "A callback fired when the calendar view changes, such as when navigating between months.", + "value": "CallbackEventListener | null", + "description": "The callback that's triggered when the visible month or year in the calendar changes.", "isOptional": true } ], - "value": "export interface DatePickerEvents {\n /**\n * A callback fired when the calendar view changes, such as when navigating between months.\n */\n viewchange: CallbackEventListener | null = null;\n /**\n * A callback fired when the date picker receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener | null = null;\n /**\n * A callback fired when the date picker loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener | null = null;\n /**\n * A callback fired when the user inputs data into the date picker.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener | null = null;\n /**\n * A callback fired when the date picker value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener | null = null;\n}" + "value": "export interface DatePickerEvents {\n /**\n * The callback that's triggered when the visible month or year in the calendar changes.\n */\n viewchange: CallbackEventListener | null;\n /**\n * The callback that's triggered when the picker receives focus.\n */\n focus: CallbackEventListener | null;\n /**\n * The callback that's triggered when the picker loses focus.\n */\n blur: CallbackEventListener | null;\n /**\n * The callback that's triggered when the selected date changes as the user interacts with the picker.\n */\n input: CallbackEventListener | null;\n /**\n * The callback that's triggered when the selected date changes and the picker loses focus.\n */\n change: CallbackEventListener | null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -127758,9 +142745,25 @@ "Divider": { "filePath": "src/surfaces/admin/components.ts", "name": "Divider", - "description": "Configure the following properties on the divider component.", - "isPublicDocs": true, + "description": "A divider is a visual separator that creates a line between different sections of content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -127784,7 +142787,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -127829,7 +142832,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -127841,15 +142844,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Divider extends PreactCustomElement implements DividerProps {\n accessor direction: DividerProps['direction'];\n accessor color: DividerProps['color'];\n constructor();\n}" + "value": "declare class Divider extends PolarisCustomElement implements DividerProps {\n /**\n * The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n *\n * - `inline`: Horizontal divider for separating vertically stacked content\n * - `block`: Vertical divider for separating horizontally arranged content\n *\n * @default 'inline'\n */\n direction: DividerProps['direction'];\n /**\n * The visual prominence of the divider line.\n *\n * - `base`: Standard divider for most separations (default)\n * - `strong`: More prominent divider for major section breaks\n *\n * @default 'base'\n */\n color: DividerProps['color'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -127872,7 +142882,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -127880,7 +142890,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -127888,7 +142898,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -127896,11 +142906,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } } @@ -128017,13 +143027,20 @@ "DropZone": { "filePath": "src/surfaces/admin/components.ts", "name": "DropZone", - "description": "Configure the following properties on the drop zone component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@getFileInput@11616", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@getFileInput@16970", "value": "() => HTMLInputElement", "description": "", "isPrivate": true, @@ -128032,7 +143049,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals@11615", + "name": "__@internals@16969", "value": "ElementInternals", "description": "", "isPrivate": true, @@ -128041,12 +143058,21 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@setFiles@11614", + "name": "__@setFiles@16968", "value": "(files: File[]) => void", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", @@ -128087,7 +143113,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -128105,7 +143131,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -128122,8 +143148,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -128148,8 +143174,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -128157,7 +143183,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -128175,7 +143201,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -128183,7 +143209,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -128192,7 +143218,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -128205,6 +143231,14 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -128215,13 +143249,12 @@ "isOptional": true } ], - "value": "declare class DropZone extends BaseClass implements DropZoneProps {\n accessor accept: DropZoneProps['accept'];\n accessor accessibilityLabel: DropZoneProps['accessibilityLabel'];\n accessor disabled: DropZoneProps['disabled'];\n accessor error: DropZoneProps['error'];\n accessor label: DropZoneProps['label'];\n accessor labelAccessibilityVisibility: DropZoneProps['labelAccessibilityVisibility'];\n accessor multiple: DropZoneProps['multiple'];\n accessor name: DropZoneProps['name'];\n accessor required: DropZoneProps['required'];\n get value(): string;\n /** This sets the input value for a file type, which cannot be set programatically, so it can only be reset. */\n set value(value: '' | null);\n get files(): File[];\n set files(files: File[]);\n /** @private */\n [setFiles](files: File[]): void;\n /** @private */\n [getFileInput](): ReplaceType<\n Element | null | undefined,\n Element,\n HTMLInputElement\n >;\n\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DropZone extends DropZoneBase implements DropZoneProps {\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -128244,7 +143277,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -128252,7 +143285,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -128260,7 +143293,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -128268,11 +143301,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -128284,51 +143317,48 @@ "DropZoneEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "DropZoneEvents", - "description": "The drop zone component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "change", - "value": "CallbackEventListener", - "description": "A callback fired when the drop zone value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "value": "CallbackEventListener", + "description": "A callback fired when the user selects files through the file picker or drops valid files onto the drop zone. Access the selected files through `event.currentTarget.files`. Use to process uploads, generate previews, or validate file contents.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "droprejected", - "value": "CallbackEventListener", - "description": "A callback fired when a dropped file is rejected due to file type or size restrictions.", + "value": "CallbackEventListener", + "description": "A callback fired when dropped or selected files don't match the `accept` criteria. Use to display error messages explaining which file types are allowed. Rejected files are not added to the `files` array.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "input", - "value": "CallbackEventListener", - "description": "A callback fired when the user inputs data into the drop zone.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "value": "CallbackEventListener", + "description": "A callback fired when files are selected or dropped. Similar to `onChange` but may fire more frequently during drag operations. Use when you need immediate feedback as files are being dragged over the drop zone.", "isOptional": true } ], - "value": "export interface DropZoneEvents {\n /**\n * A callback fired when the drop zone value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener = null;\n /**\n * A callback fired when the user inputs data into the drop zone.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener = null;\n /**\n * A callback fired when a dropped file is rejected due to file type or size restrictions.\n */\n droprejected: CallbackEventListener = null;\n}" + "value": "export interface DropZoneEvents {\n /**\n * A callback fired when the user selects files through the file picker or drops valid\n * files onto the drop zone. Access the selected files through `event.currentTarget.files`.\n * Use to process uploads, generate previews, or validate file contents.\n */\n change: CallbackEventListener;\n /**\n * A callback fired when files are selected or dropped. Similar to `onChange` but may\n * fire more frequently during drag operations. Use when you need immediate feedback as\n * files are being dragged over the drop zone.\n */\n input: CallbackEventListener;\n /**\n * A callback fired when dropped or selected files don't match the `accept` criteria.\n * Use to display error messages explaining which file types are allowed. Rejected files\n * are not added to the `files` array.\n */\n droprejected: CallbackEventListener;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -128534,18 +143564,34 @@ "EmailField": { "filePath": "src/surfaces/admin/components.ts", "name": "EmailField", - "description": "Configure the following properties on the email field component.", - "isPublicDocs": true, + "description": "The email field custom element class that renders an email input field in the Shopify admin interface. This component allows merchants to enter email addresses with automatic validation and optimized mobile keyboard layouts.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -128569,8 +143615,8 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | EmailAutocompleteField | `section-${string} email` | `section-${string} home email` | `section-${string} mobile email` | `section-${string} fax email` | `section-${string} pager email` | \"shipping email\" | \"shipping home email\" | \"shipping mobile email\" | \"shipping fax email\" | \"shipping pager email\" | \"billing email\" | \"billing home email\" | \"billing mobile email\" | \"billing fax email\" | \"billing pager email\" | `section-${string} shipping email` | `section-${string} shipping home email` | `section-${string} shipping mobile email` | `section-${string} shipping fax email` | `section-${string} shipping pager email` | `section-${string} billing email` | `section-${string} billing home email` | `section-${string} billing mobile email` | `section-${string} billing fax email` | `section-${string} billing pager email`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else", + "description": "A hint as to the intended content of the field for autocomplete purposes.", + "defaultValue": "'email'", "isOptional": true }, { @@ -128578,7 +143624,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -128596,15 +143642,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -128612,7 +143658,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -128629,8 +143675,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -128665,7 +143711,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -128673,7 +143719,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -128681,8 +143727,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -128690,7 +143736,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -128699,7 +143745,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity", "isOptional": true }, @@ -128708,7 +143754,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0", "isOptional": true }, @@ -128717,7 +143763,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -128725,7 +143771,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -128733,7 +143779,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -128742,7 +143788,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -128751,7 +143797,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -128764,30 +143810,36 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing.", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true } ], - "value": "declare class EmailField\n extends PreactFieldElement\n implements EmailFieldProps\n{\n accessor autocomplete: EmailFieldProps['autocomplete'];\n accessor maxLength: EmailFieldProps['maxLength'];\n accessor minLength: EmailFieldProps['minLength'];\n /**\n * The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class EmailField extends EmailFieldBase implements EmailFieldProps {\n constructor();\n}" }, "EmailAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "EmailAutocompleteField", "value": "'email' | 'home email' | 'mobile email' | 'fax email' | 'pager email'", - "description": "Represents autocomplete values that are valid for email input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for email inputs.\n\nAvailable values:\n- `email` - Primary email address\n- `home email` - Home email address\n- `mobile email` - Mobile device email address\n- `fax email` - Fax machine email address\n- `pager email` - Pager device email address", - "isPublicDocs": true + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -128810,7 +143862,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -128818,7 +143870,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -128826,7 +143878,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -128834,11 +143886,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -128850,15 +143902,14 @@ "EmailFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "EmailFieldEvents", - "description": "The email field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the email field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -128866,7 +143917,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the email field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -128874,7 +143925,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the email field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -128882,27 +143933,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the email field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface EmailFieldEvents {\n /**\n * A callback fired when the email field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the email field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the email field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the email field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface EmailFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -129036,15 +144085,14 @@ "FormEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "FormEvents", - "description": "The form component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "reset", "value": "CallbackEventListener | null", - "description": "A callback that is run when the form is reset.", + "description": "A callback that's invoked when the form is reset, restoring all form fields to their initial values.", "isOptional": true }, { @@ -129052,35 +144100,32 @@ "syntaxKind": "PropertySignature", "name": "submit", "value": "CallbackExtendableEventListener | null", - "description": "A callback that is run when the form is submitted.", + "description": "A callback that's invoked when the form is submitted. Use the event's `waitUntil` method to perform async operations like validation, data processing, or API calls before the submission completes.", "isOptional": true } ], - "value": "export interface FormEvents {\n /**\n * A callback that is run when the form is submitted.\n */\n submit: CallbackExtendableEventListener | null = null;\n /**\n * A callback that is run when the form is reset.\n */\n reset: CallbackEventListener | null = null;\n}" + "value": "export interface FormEvents {\n /**\n * A callback that's invoked when the form is submitted. Use the event's `waitUntil` method to perform async operations like validation, data processing, or API calls before the submission completes.\n */\n submit: CallbackExtendableEventListener | null = null;\n /**\n * A callback that's invoked when the form is reset, restoring all form fields to their initial values.\n */\n reset: CallbackEventListener | null = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." }, "CallbackExtendableEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackExtendableEventListener", "value": "(EventListener & {\n (event: CallbackExtendableEvent): void;\n }) | null", - "description": "A function that handles extendable events from UI components. This type represents an event listener callback that can use `waitUntil` to extend the event lifetime.", - "isPublicDocs": true + "description": "A function that handles extendable events from UI components. This type represents an event listener callback that can use `waitUntil` to extend the event lifetime." }, "CallbackExtendableEvent": { "filePath": "src/surfaces/admin/components.ts", @@ -129272,7 +144317,7 @@ "syntaxKind": "PropertySignature", "name": "waitUntil", "value": "(promise: Promise) => void", - "description": "A method that accepts a promise signaling the duration and eventual success or failure of event-related actions.\n\nCan be called multiple times to add promises to the event, but must be called synchronously during event dispatch. Cannot be called after a `setTimeout` or within a microtask.", + "description": "Provide a promise that signals the length, and eventual success or failure of actions relating to the event.\n\nThis may be called many times, which adds promises to the event.\n\nHowever, this may only be called synchronously during the dispatch of the event. As in, you cannot call it after a `setTimeout` or microtask.", "isOptional": true } ], @@ -129404,15 +144449,14 @@ "FormEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "FormEvents", - "description": "The form component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "reset", "value": "CallbackEventListener | null", - "description": "A callback that is run when the form is reset.", + "description": "A callback that's invoked when the form is reset, restoring all form fields to their initial values.", "isOptional": true }, { @@ -129420,35 +144464,32 @@ "syntaxKind": "PropertySignature", "name": "submit", "value": "CallbackExtendableEventListener | null", - "description": "A callback that is run when the form is submitted.", + "description": "A callback that's invoked when the form is submitted. Use the event's `waitUntil` method to perform async operations like validation, data processing, or API calls before the submission completes.", "isOptional": true } ], - "value": "export interface FormEvents {\n /**\n * A callback that is run when the form is submitted.\n */\n submit: CallbackExtendableEventListener | null = null;\n /**\n * A callback that is run when the form is reset.\n */\n reset: CallbackEventListener | null = null;\n}" + "value": "export interface FormEvents {\n /**\n * A callback that's invoked when the form is submitted. Use the event's `waitUntil` method to perform async operations like validation, data processing, or API calls before the submission completes.\n */\n submit: CallbackExtendableEventListener | null = null;\n /**\n * A callback that's invoked when the form is reset, restoring all form fields to their initial values.\n */\n reset: CallbackEventListener | null = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." }, "CallbackExtendableEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackExtendableEventListener", "value": "(EventListener & {\n (event: CallbackExtendableEvent): void;\n }) | null", - "description": "A function that handles extendable events from UI components. This type represents an event listener callback that can use `waitUntil` to extend the event lifetime.", - "isPublicDocs": true + "description": "A function that handles extendable events from UI components. This type represents an event listener callback that can use `waitUntil` to extend the event lifetime." }, "CallbackExtendableEvent": { "filePath": "src/surfaces/admin/components.ts", @@ -129640,7 +144681,7 @@ "syntaxKind": "PropertySignature", "name": "waitUntil", "value": "(promise: Promise) => void", - "description": "A method that accepts a promise signaling the duration and eventual success or failure of event-related actions.\n\nCan be called multiple times to add promises to the event, but must be called synchronously during event dispatch. Cannot be called after a `setTimeout` or within a microtask.", + "description": "Provide a promise that signals the length, and eventual success or failure of actions relating to the event.\n\nThis may be called many times, which adds promises to the event.\n\nHowever, this may only be called synchronously during the dispatch of the event. As in, you cannot call it after a `setTimeout` or microtask.", "isOptional": true } ], @@ -129777,15 +144818,31 @@ "Grid": { "filePath": "src/surfaces/admin/components.ts", "name": "Grid", - "description": "Configure the following properties on the grid component.", - "isPublicDocs": true, + "description": "A grid is a layout component that arranges its children in rows and columns with precise control over sizing and alignment.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { @@ -129793,7 +144850,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'", "isOptional": true }, @@ -129802,7 +144859,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -129820,7 +144877,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "\"\" | AlignContentKeyword", - "description": "Aligns the grid along the block axis. This overrides the block value of `placeContent`.", + "description": "The alignment of the grid along the block axis.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -129829,7 +144886,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "\"\" | AlignItemsKeyword", - "description": "Aligns the grid items along the block axis.", + "description": "The alignment of grid items along the block axis.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -129847,7 +144904,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'", "isOptional": true }, @@ -129856,7 +144913,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'", "isOptional": true }, @@ -129865,7 +144922,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -129886,7 +144943,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -129895,7 +144952,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'", "isOptional": true }, @@ -129904,7 +144961,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -129913,7 +144970,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -129922,7 +144979,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -129931,7 +144988,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid columns.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -129958,7 +145015,7 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'", "isOptional": true }, @@ -129967,7 +145024,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows and columns.", "defaultValue": "'none'", "isOptional": true }, @@ -129976,7 +145033,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridTemplateColumns", "value": "string", - "description": "The columns in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid columns.", "defaultValue": "'none'", "isOptional": true }, @@ -129985,7 +145042,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridTemplateRows", "value": "string", - "description": "The rows in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid rows.", "defaultValue": "'none'", "isOptional": true }, @@ -129994,7 +145051,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'", "isOptional": true }, @@ -130003,7 +145060,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "\"\" | JustifyContentKeyword", - "description": "Aligns the grid along the inline axis. This overrides the inline value of `placeContent`.", + "description": "The alignment of the grid along the inline axis.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130012,7 +145069,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyItems", "value": "\"\" | JustifyItemsKeyword", - "description": "Aligns the grid items along the inline axis.", + "description": "The alignment of grid items along the inline axis.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130021,7 +145078,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -130030,7 +145087,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -130039,7 +145096,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -130048,7 +145105,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -130057,7 +145114,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'", "isOptional": true }, @@ -130066,7 +145123,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'", "isOptional": true }, @@ -130075,7 +145132,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130084,7 +145141,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130093,7 +145150,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130102,7 +145159,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130111,7 +145168,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130120,7 +145177,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130129,7 +145186,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeContent", "value": "\"normal normal\" | \"normal stretch\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\" | AlignContentKeyword | \"normal space-between\" | \"normal space-around\" | \"normal space-evenly\" | \"baseline space-between\" | \"baseline space-around\" | \"baseline space-evenly\" | \"first baseline space-between\" | \"first baseline space-around\" | \"first baseline space-evenly\" | \"last baseline space-between\" | \"last baseline space-around\" | \"last baseline space-evenly\" | \"start space-between\" | \"start space-around\" | \"start space-evenly\" | \"end space-between\" | \"end space-around\" | \"end space-evenly\" | \"center space-between\" | \"center space-around\" | \"center space-evenly\" | \"unsafe start space-between\" | \"unsafe start space-around\" | \"unsafe start space-evenly\" | \"unsafe end space-between\" | \"unsafe end space-around\" | \"unsafe end space-evenly\" | \"unsafe center space-between\" | \"unsafe center space-around\" | \"unsafe center space-evenly\" | \"safe start space-between\" | \"safe start space-around\" | \"safe start space-evenly\" | \"safe end space-between\" | \"safe end space-around\" | \"safe end space-evenly\" | \"safe center space-between\" | \"safe center space-around\" | \"safe center space-evenly\" | \"stretch space-between\" | \"stretch space-around\" | \"stretch space-evenly\" | \"space-between normal\" | \"space-between start\" | \"space-between end\" | \"space-between center\" | \"space-between unsafe start\" | \"space-between unsafe end\" | \"space-between unsafe center\" | \"space-between safe start\" | \"space-between safe end\" | \"space-between safe center\" | \"space-between stretch\" | \"space-between space-between\" | \"space-between space-around\" | \"space-between space-evenly\" | \"space-around normal\" | \"space-around start\" | \"space-around end\" | \"space-around center\" | \"space-around unsafe start\" | \"space-around unsafe end\" | \"space-around unsafe center\" | \"space-around safe start\" | \"space-around safe end\" | \"space-around safe center\" | \"space-around stretch\" | \"space-around space-between\" | \"space-around space-around\" | \"space-around space-evenly\" | \"space-evenly normal\" | \"space-evenly start\" | \"space-evenly end\" | \"space-evenly center\" | \"space-evenly unsafe start\" | \"space-evenly unsafe end\" | \"space-evenly unsafe center\" | \"space-evenly safe start\" | \"space-evenly safe end\" | \"space-evenly safe center\" | \"space-evenly stretch\" | \"space-evenly space-between\" | \"space-evenly space-around\" | \"space-evenly space-evenly\"", - "description": "A shorthand property for `justify-content` and `align-content`.", + "description": "A shorthand for setting both `alignContent` and `justifyContent`.", "defaultValue": "'normal normal'", "isOptional": true }, @@ -130138,7 +145195,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeItems", "value": "AlignItemsKeyword | \"normal normal\" | \"normal stretch\" | \"normal baseline\" | \"normal first baseline\" | \"normal last baseline\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch baseline\" | \"stretch first baseline\" | \"stretch last baseline\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline baseline\" | \"baseline first baseline\" | \"baseline last baseline\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline baseline\" | \"first baseline first baseline\" | \"first baseline last baseline\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline baseline\" | \"last baseline first baseline\" | \"last baseline last baseline\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start baseline\" | \"start first baseline\" | \"start last baseline\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end baseline\" | \"end first baseline\" | \"end last baseline\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center baseline\" | \"center first baseline\" | \"center last baseline\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start baseline\" | \"unsafe start first baseline\" | \"unsafe start last baseline\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end baseline\" | \"unsafe end first baseline\" | \"unsafe end last baseline\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center baseline\" | \"unsafe center first baseline\" | \"unsafe center last baseline\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start baseline\" | \"safe start first baseline\" | \"safe start last baseline\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end baseline\" | \"safe end first baseline\" | \"safe end last baseline\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center baseline\" | \"safe center first baseline\" | \"safe center last baseline\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\"", - "description": "A shorthand property for `justify-items` and `align-items`.", + "description": "A shorthand for setting both `alignItems` and `justifyItems`.", "defaultValue": "'normal normal'", "isOptional": true }, @@ -130147,7 +145204,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -130156,7 +145213,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "s spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130168,200 +145225,185 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n accessor gridTemplateColumns: GridProps['gridTemplateColumns'];\n accessor gridTemplateRows: GridProps['gridTemplateRows'];\n accessor justifyItems: GridProps['justifyItems'];\n accessor alignItems: GridProps['alignItems'];\n accessor placeItems: GridProps['placeItems'];\n accessor justifyContent: GridProps['justifyContent'];\n accessor alignContent: GridProps['alignContent'];\n accessor placeContent: GridProps['placeContent'];\n accessor gap: GridProps['gap'];\n accessor rowGap: GridProps['rowGap'];\n accessor columnGap: GridProps['columnGap'];\n}" + "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n /**\n * The template that defines the grid columns.\n */\n gridTemplateColumns: GridProps['gridTemplateColumns'];\n /**\n * The template that defines the grid rows.\n */\n gridTemplateRows: GridProps['gridTemplateRows'];\n /**\n * The alignment of grid items along the inline axis.\n */\n justifyItems: GridProps['justifyItems'];\n /**\n * The alignment of grid items along the block axis.\n */\n alignItems: GridProps['alignItems'];\n /**\n * A shorthand for setting both `alignItems` and `justifyItems`.\n */\n placeItems: GridProps['placeItems'];\n /**\n * The alignment of the grid along the inline axis.\n */\n justifyContent: GridProps['justifyContent'];\n /**\n * The alignment of the grid along the block axis.\n */\n alignContent: GridProps['alignContent'];\n /**\n * A shorthand for setting both `alignContent` and `justifyContent`.\n */\n placeContent: GridProps['placeContent'];\n /**\n * The spacing between grid rows and columns.\n */\n gap: GridProps['gap'];\n /**\n * The spacing between grid rows.\n */\n rowGap: GridProps['rowGap'];\n /**\n * The spacing between grid columns.\n */\n columnGap: GridProps['columnGap'];\n}" }, "JustifyItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.\n\nLearn more about the [justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).", - "isPublicDocs": true + "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis." }, "BaselinePosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BaselinePosition", "value": "'baseline' | 'first baseline' | 'last baseline'", - "description": "Represents baseline alignment positions used to align items relative to their baselines.\n- `baseline`: Aligns to the baseline of the parent.\n- `first baseline`: Aligns to the first baseline of the parent.\n- `last baseline`: Aligns to the last baseline of the parent.", - "isPublicDocs": true + "description": "" }, "OverflowPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "OverflowPosition", "value": "`unsafe ${ContentPosition}` | `safe ${ContentPosition}`", - "description": "Represents content positioning with overflow behavior control. Use `safe` to prevent content from becoming inaccessible when it overflows, or `unsafe` to allow overflow regardless of accessibility.", - "isPublicDocs": true + "description": "" }, "ContentPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentPosition", "value": "'center' | 'start' | 'end'", - "description": "Defines the position of content along an axis.\n- `center`: Centers the content.\n- `start`: Aligns content to the start.\n- `end`: Aligns content to the end.", - "isPublicDocs": true + "description": "" }, "AlignItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Align items sets the align-self value on all direct children as a group.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isPublicDocs": true + "description": "Align items sets the align-self value on all direct children as a group." }, "JustifyContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyContentKeyword", "value": "'normal' | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", - "isPublicDocs": true + "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container." }, "ContentDistribution": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentDistribution", "value": "'space-between' | 'space-around' | 'space-evenly' | 'stretch'", - "description": "Defines how space is distributed between and around content items in flex and grid layouts.\n- `space-between`: Distributes items evenly with the first item at the start and last at the end.\n- `space-around`: Distributes items evenly with equal space around each item.\n- `space-evenly`: Distributes items evenly with equal space between them.\n- `stretch`: Stretches items to fill the container.", - "isPublicDocs": true + "description": "" }, "AlignContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignContentKeyword", "value": "'normal' | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isPublicDocs": true + "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis." }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "SpacingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SpacingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the spacing size between elements, using the standard size scale or `none` for no spacing.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "AccessibilityRole": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -130369,14 +145411,13 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -130399,7 +145440,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -130407,7 +145448,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -130415,7 +145456,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -130423,11 +145464,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -130439,19 +145480,18 @@ "GridSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "GridSlots", - "description": "The grid component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The child elements displayed within the grid component, which are arranged in a flexible grid layout with configurable columns, rows, and spacing.", + "description": "The child elements to render inside the grid.", "isOptional": true } ], - "value": "export interface GridSlots {\n /**\n * The child elements displayed within the grid component, which are arranged in a flexible grid layout with configurable columns, rows, and spacing.\n */\n children?: HTMLElement;\n}" + "value": "export interface GridSlots {\n /**\n * The child elements to render inside the grid.\n */\n children?: HTMLElement;\n}" } } }, @@ -130463,15 +145503,31 @@ "GridItem": { "filePath": "src/surfaces/admin/components.ts", "name": "GridItem", - "description": "The grid item component represents a single cell within a grid layout, allowing you to control how content is positioned and sized within the grid. Use grid item as a child of grid to specify column span, row span, and positioning for individual content areas.\n\nGrid item supports precise placement control through column and row properties, enabling you to create complex layouts where different items occupy varying amounts of space or appear in specific grid positions.", - "isPublicDocs": true, + "description": "A grid item is a child of a grid that can be positioned within specific rows and columns.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { @@ -130479,7 +145535,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'", "isOptional": true }, @@ -130488,7 +145544,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -130515,7 +145571,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'", "isOptional": true }, @@ -130524,7 +145580,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'", "isOptional": true }, @@ -130533,7 +145589,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -130554,7 +145610,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130563,7 +145619,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'", "isOptional": true }, @@ -130572,7 +145628,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130581,7 +145637,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130590,7 +145646,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -130617,7 +145673,7 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'", "isOptional": true }, @@ -130626,7 +145682,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridColumn", "value": "\"auto\" | `span ${number}`", - "description": "The number of columns the item will span across.\n\nLearn more about the [grid-column property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).", + "description": "The column position and span of the grid item.", "defaultValue": "'auto'", "isOptional": true }, @@ -130635,7 +145691,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridRow", "value": "\"auto\" | `span ${number}`", - "description": "The number of rows the item will span across.\n\nLearn more about the [grid-row property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).", + "description": "The row position and span of the grid item.", "defaultValue": "'auto'", "isOptional": true }, @@ -130644,7 +145700,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'", "isOptional": true }, @@ -130653,7 +145709,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -130662,7 +145718,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -130671,7 +145727,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -130680,7 +145736,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -130689,7 +145745,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'", "isOptional": true }, @@ -130698,7 +145754,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'", "isOptional": true }, @@ -130707,7 +145763,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130716,7 +145772,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130725,7 +145781,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130734,7 +145790,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130743,7 +145799,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130752,7 +145808,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -130761,7 +145817,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -130773,128 +145829,122 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class GridItem extends BoxElement implements GridItemProps {\n accessor gridColumn: GridItemProps['gridColumn'];\n accessor gridRow: GridItemProps['gridRow'];\n constructor();\n}" + "value": "declare class GridItem extends BoxElement implements GridItemProps {\n /**\n * The column position and span of the grid item.\n */\n gridColumn: GridItemProps['gridColumn'];\n /**\n * The row position and span of the grid item.\n */\n gridRow: GridItemProps['gridRow'];\n constructor();\n}" }, "AccessibilityRole": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -130902,14 +145952,13 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -130932,7 +145981,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -130940,7 +145989,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -130948,7 +145997,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -130956,11 +146005,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -130972,19 +146021,18 @@ "GridItemSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "GridItemSlots", - "description": "The grid item component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The content displayed within the grid item component, which represents a single cell in the grid layout and can span multiple columns or rows.", + "description": "The child elements to render inside the grid item.", "isOptional": true } ], - "value": "export interface GridItemSlots {\n /**\n * The content displayed within the grid item component, which represents a single cell in the grid layout and can span multiple columns or rows.\n */\n children?: HTMLElement;\n}" + "value": "export interface GridItemSlots {\n /**\n * The child elements to render inside the grid item.\n */\n children?: HTMLElement;\n}" } } } @@ -131101,15 +146149,31 @@ "Heading": { "filePath": "src/surfaces/admin/components.ts", "name": "Heading", - "description": "Configure the following properties on the heading component.", - "isPublicDocs": true, + "description": "A custom element for displaying hierarchical section titles and headings with appropriate semantic meaning and visual styling. Use Heading to structure your content with proper heading levels for both visual hierarchy and accessibility.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"heading\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The ARIA role for the heading. Set to `'heading'` (the default) for standard heading semantics, or `'presentation'` / `'none'` to remove heading semantics for decorative use.", "defaultValue": "'heading'", "isOptional": true }, @@ -131118,7 +146182,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'", "isOptional": true }, @@ -131145,7 +146209,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -131172,7 +146236,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lineClamp", "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", "defaultValue": "Infinity - no truncation is applied", "isOptional": true }, @@ -131181,7 +146245,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -131193,15 +146257,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Heading extends PreactCustomElement implements HeadingProps {\n accessor accessibilityRole: HeadingProps['accessibilityRole'];\n accessor lineClamp: HeadingProps['lineClamp'];\n accessor accessibilityVisibility: HeadingProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Heading extends HeadingBase implements HeadingProps {\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -131224,7 +146295,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -131232,7 +146303,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -131240,7 +146311,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -131248,11 +146319,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -131264,19 +146335,18 @@ "HeadingSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "HeadingSlots", - "description": "The heading component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The heading text displayed within the heading component, which provides a title or section header for content.", + "description": "The content of the heading.", "isOptional": true } ], - "value": "export interface HeadingSlots {\n /**\n * The heading text displayed within the heading component, which provides a title or section header for content.\n */\n children?: HTMLElement;\n}" + "value": "export interface HeadingSlots {\n /**\n * The content of the heading.\n */\n children?: HTMLElement;\n}" } } } @@ -131375,7 +146445,7 @@ "title": "Available icons", "type": "Generic", "anchorLink": "available-icons", - "sectionContent": "Search and filter across all the available icons: \n \n " + "sectionContent": "Search and filter across all the available icons: \n \n " }, { "title": "Best practices", @@ -131399,9 +146469,25 @@ "Icon": { "filePath": "src/surfaces/admin/components.ts", "name": "Icon", - "description": "Configure the following properties on the icon component.", - "isPublicDocs": true, + "description": "An icon displays a graphical symbol from the icon library.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -131425,7 +146511,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -131434,7 +146520,7 @@ "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color emphasis of the icon.", "defaultValue": "'base'", "isOptional": true }, @@ -131461,7 +146547,7 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "The element that this icon should show interest for when activated.", "isOptional": true }, { @@ -131469,7 +146555,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -131487,7 +146573,7 @@ "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"base\"", - "description": "The size of the icon.\n\n- `small`: Smaller icon suitable for inline use within text or compact UI elements.\n- `base`: Default size that works well for standalone icons and standard use cases.", + "description": "The size of the icon.", "defaultValue": "'base'", "isOptional": true }, @@ -131496,7 +146582,7 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", + "description": "The color tone of the icon based on its semantic meaning.", "defaultValue": "'auto'", "isOptional": true }, @@ -131504,18 +146590,32 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "The icon to display from the icon library.\n\nSet to a valid icon name to display that icon. To hide the icon completely, use an empty string `''`. To reserve the icon's space without displaying an icon, use `'empty'`.", + "value": "\"\" | IconType", + "description": "The type of icon to display.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", "isOptional": true } ], - "value": "declare class Icon extends PreactCustomElement implements IconProps {\n accessor color: IconProps['color'];\n accessor tone: IconProps['tone'];\n accessor type: IconProps['type'];\n accessor size: IconProps['size'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Icon extends IconBase implements IconProps {\n /**\n * The color tone of the icon based on its semantic meaning.\n */\n tone: IconProps['tone'];\n /**\n * The type of icon to display.\n */\n type: IconProps['type'];\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -131538,7 +146638,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -131546,7 +146646,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -131554,7 +146654,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -131562,11 +146662,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } } @@ -131751,15 +146851,31 @@ "Image": { "filePath": "src/surfaces/admin/components.ts", "name": "Image", - "description": "Configure the following properties on the image component.", - "isPublicDocs": true, + "description": "An image displays pictures with configurable sizing, loading behavior, and borders.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"img\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The accessibility role for the image.", "defaultValue": "'img'", "isOptional": true }, @@ -131777,8 +146893,8 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``", + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`", "isOptional": true }, { @@ -131786,7 +146902,7 @@ "syntaxKind": "PropertyDeclaration", "name": "aspectRatio", "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", - "description": "The aspect ratio of the image.\n\nThe rendering of the image will depend on the `inlineSize` value:\n\n- `inlineSize=\"fill\"`: the aspect ratio will be respected and the image will take the necessary space.\n- `inlineSize=\"auto\"`: the image will not render until it has loaded and the aspect ratio will be ignored.\n\nFor example, if the value is set as `50 / 100`, the getter returns `50 / 100`. If the value is set as `0.5`, the getter returns `0.5 / 1`.\n\nLearn more about the [aspect-ratio property](https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio).", + "description": "The aspect ratio of the image as a width-to-height ratio.", "defaultValue": "'1/1'", "isOptional": true }, @@ -131804,20 +146920,8 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied around the image using shorthand syntax to specify width, color, and style in a single property.", + "description": "Whether to show a border around the image.", "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ], "isOptional": true }, { @@ -131825,7 +146929,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "The color of the border around the image.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -131833,8 +146937,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the image's corners using the design system's radius scale.", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image.", "defaultValue": "'none'", "isOptional": true }, @@ -131842,8 +146946,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderStyle", - "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -131851,8 +146955,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderWidth", - "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -131861,7 +146965,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -131888,7 +146992,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "\"auto\" | \"fill\"", - "description": "The displayed inline width of the image.\n\n- `fill`: the image will takes up 100% of the available inline size.\n- `auto`: the image will be displayed at its natural size.\n\nLearn more about the [width attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#width).", + "description": "The inline size (width in horizontal writing modes) of the image.", "defaultValue": "'fill'", "isOptional": true }, @@ -131897,7 +147001,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "\"eager\" | \"lazy\"", - "description": "The loading strategy for the image.\n\n- `eager`: Immediately loads the image, irrespective of its position within the visible viewport.\n- `lazy`: Delays loading the image until it approaches a specified distance from the viewport.\n\nLearn more about the [loading attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading).", + "description": "When the image should be loaded.", "defaultValue": "'eager'", "isOptional": true }, @@ -131906,7 +147010,7 @@ "syntaxKind": "PropertyDeclaration", "name": "objectFit", "value": "\"contain\" | \"cover\"", - "description": "The image resizing behavior to fit within its container.\n\n- `contain`: Scales the image to fit within the container while maintaining its aspect ratio. The entire image is visible, but might leave empty space.\n- `cover`: Scales the image to fill the entire container while maintaining its aspect ratio. The image might be cropped to fit.\n\nThe image is always positioned in the center of the container.\n\nLearn more about the [object-fit property](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).", + "description": "How the image should be resized to fit its container.", "defaultValue": "'contain'", "isOptional": true }, @@ -131915,7 +147019,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -131933,7 +147037,7 @@ "syntaxKind": "PropertyDeclaration", "name": "sizes", "value": "string", - "description": "A set of media conditions and their corresponding sizes.\n\nLearn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes).", + "description": "The sizes of the image at different viewport widths.", "isOptional": true }, { @@ -131941,7 +147045,7 @@ "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered.", + "description": "The URL of the image to display.", "isOptional": true }, { @@ -131949,81 +147053,73 @@ "syntaxKind": "PropertyDeclaration", "name": "srcSet", "value": "string", - "description": "A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n\nLearn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset).", + "description": "A set of source images with different sizes for responsive loading.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", "isOptional": true } ], - "value": "declare class Image extends PreactCustomElement implements ImageProps {\n accessor src: ImageProps['src'];\n accessor srcSet: ImageProps['srcSet'];\n accessor sizes: ImageProps['sizes'];\n accessor alt: ImageProps['alt'];\n accessor aspectRatio: ImageProps['aspectRatio'];\n accessor objectFit: ImageProps['objectFit'];\n accessor loading: ImageProps['loading'];\n accessor accessibilityRole: ImageProps['accessibilityRole'];\n accessor inlineSize: ImageProps['inlineSize'];\n /**\n * A border applied around the image using shorthand syntax to specify width, color, and style in a single property.\n */\n accessor border: ImageProps['border'];\n /**\n * The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.\n */\n accessor borderWidth: ImageProps['borderWidth'];\n /**\n * The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.\n */\n accessor borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.\n */\n accessor borderColor: ImageProps['borderColor'];\n /**\n * The roundedness of the image's corners using the design system's radius scale.\n */\n accessor borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + "value": "declare class Image extends PolarisCustomElement implements ImageProps {\n /**\n * The URL of the image to display.\n */\n src: ImageProps['src'];\n /**\n * A set of source images with different sizes for responsive loading.\n */\n srcSet: ImageProps['srcSet'];\n /**\n * The sizes of the image at different viewport widths.\n */\n sizes: ImageProps['sizes'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ImageProps['alt'];\n /**\n * The aspect ratio of the image as a width-to-height ratio.\n */\n aspectRatio: ImageProps['aspectRatio'];\n /**\n * How the image should be resized to fit its container.\n */\n objectFit: ImageProps['objectFit'];\n /**\n * When the image should be loaded.\n */\n loading: ImageProps['loading'];\n /**\n * The accessibility role for the image.\n */\n accessibilityRole: ImageProps['accessibilityRole'];\n /**\n * The inline size (width in horizontal writing modes) of the image.\n */\n inlineSize: ImageProps['inlineSize'];\n /**\n * Whether to show a border around the image.\n */\n border: ImageProps['border'];\n /**\n * The width of the border around the image.\n */\n borderWidth: ImageProps['borderWidth'];\n /**\n * The style of the border around the image.\n */\n borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image.\n */\n borderColor: ImageProps['borderColor'];\n /**\n * The radius of the border corners around the image.\n */\n borderRadius: ImageProps['borderRadius'];\n constructor();\n}" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true - }, - "BoxBorderStyles": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "BoxBorderStyles", - "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", - "isPublicDocs": true + "description": "" }, - "BoxBorderRadii": { + "BorderRadiusKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", - "name": "BoxBorderRadii", - "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", - "isPublicDocs": true + "name": "BorderRadiusKeyword", + "value": "SizeKeyword | 'max' | 'none'", + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -132046,7 +147142,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -132054,7 +147150,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -132062,7 +147158,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -132070,11 +147166,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -132086,15 +147182,14 @@ "ImageEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ImageEvents", - "description": "The image component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "error", "value": "OnErrorEventHandler", - "description": "A callback fired when the image fails to load.\n\nLearn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).", + "description": "A callback that's fired when the image fails to load.", "isOptional": true }, { @@ -132102,27 +147197,25 @@ "syntaxKind": "PropertySignature", "name": "load", "value": "CallbackEventListener | null", - "description": "A callback fired when the image successfully loads.\n\nLearn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).", + "description": "A callback that's fired when the image has loaded successfully.", "isOptional": true } ], - "value": "export interface ImageEvents {\n /**\n * A callback fired when the image successfully loads.\n *\n * Learn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback fired when the image fails to load.\n *\n * Learn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).\n */\n error: OnErrorEventHandler = null;\n}" + "value": "export interface ImageEvents {\n /**\n * A callback that's fired when the image has loaded successfully.\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback that's fired when the image fails to load.\n */\n error: OnErrorEventHandler = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -132273,15 +147366,31 @@ "Link": { "filePath": "src/surfaces/admin/components.ts", "name": "Link", - "description": "Configure the following properties on the link component.", - "isPublicDocs": true, + "description": "", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies.", "isOptional": true }, { @@ -132307,7 +147416,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -132316,7 +147425,7 @@ "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'", "isOptional": true }, @@ -132325,7 +147434,7 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated.", + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated.", "isOptional": true }, { @@ -132351,7 +147460,7 @@ "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", "isOptional": true }, { @@ -132359,7 +147468,7 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { @@ -132367,7 +147476,7 @@ "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated.", "isOptional": true }, { @@ -132375,7 +147484,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lang", "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry).", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", "isOptional": true }, { @@ -132383,7 +147492,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -132401,7 +147510,7 @@ "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'", "isOptional": true }, @@ -132410,26 +147519,32 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", "defaultValue": "'auto'", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Link extends Link_base implements LinkProps {\n accessor tone: LinkProps['tone'];\n accessor accessibilityLabel: LinkProps['accessibilityLabel'];\n accessor href: LinkProps['href'];\n accessor target: LinkProps['target'];\n accessor download: LinkProps['download'];\n accessor lang: LinkProps['lang'];\n constructor();\n}" + "value": "declare class Link extends LinkBase implements LinkProps {\n tone: LinkProps['tone'];\n constructor();\n}" }, "AnyString": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AnyString", "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true + "description": "Prevents widening string literal types in a union to `string`." }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -132452,7 +147567,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -132460,7 +147575,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -132468,7 +147583,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -132476,11 +147591,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -132492,35 +147607,32 @@ "LinkEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "LinkEvents", - "description": "The link component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "click", - "value": "CallbackEventListener | null", - "description": "A callback fired when the link is clicked.\n\nLearn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", + "value": "CallbackEventListener | null", + "description": "", "isOptional": true } ], - "value": "export interface LinkEvents {\n /**\n * A callback fired when the link is clicked.\n *\n * Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n click: CallbackEventListener | null = null;\n}" + "value": "export interface LinkEvents {\n click: CallbackEventListener | null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -132532,19 +147644,18 @@ "LinkSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "LinkSlots", - "description": "The link component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The text or elements displayed within the link component, which navigates users to a different location when activated.", + "description": "The text or content to display inside the link. This typically describes the destination or action the link performs.", "isOptional": true } ], - "value": "export interface LinkSlots {\n /**\n * The text or elements displayed within the link component, which navigates users to a different location when activated.\n */\n children?: HTMLElement;\n}" + "value": "export interface LinkSlots {\n /**\n * The text or content to display inside the link. This typically describes the destination or action the link performs.\n */\n children?: HTMLElement;\n}" } } } @@ -132729,13 +147840,20 @@ "Menu": { "filePath": "src/surfaces/admin/components.ts", "name": "Menu", - "description": "Configure the following properties on the menu component.", - "isPublicDocs": true, + "description": "A component that displays a contextual list of actions or options, which is typically triggered by a button or other activator element.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@11751", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true, @@ -132744,7 +147862,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@11750", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true, @@ -132753,18 +147871,27 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@11752", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the menu for assistive technologies.", "isOptional": true }, { @@ -132790,7 +147917,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -132817,7 +147944,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -132829,15 +147956,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n accessor accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n /**\n * A label that describes the menu for assistive technologies.\n */\n accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -132860,7 +147994,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -132868,7 +148002,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -132876,7 +148010,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -132884,11 +148018,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -132900,19 +148034,18 @@ "MenuSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "MenuSlots", - "description": "The menu component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The items displayed within the menu. Only accepts button and section components. Use button for individual menu actions and section to group related items.", + "description": "The menu items to display, which should include button and section components.", "isOptional": true } ], - "value": "export interface MenuSlots {\n /**\n * The items displayed within the menu. Only accepts button and section components. Use button for individual menu actions and section to group related items.\n */\n children?: HTMLElement;\n}" + "value": "export interface MenuSlots {\n /**\n * The menu items to display, which should include button and section components.\n */\n children?: HTMLElement;\n}" } } } @@ -133063,18 +148196,34 @@ "MoneyField": { "filePath": "src/surfaces/admin/components.ts", "name": "MoneyField", - "description": "Configure the following properties on the money field component.", - "isPublicDocs": true, + "description": "The money field custom element class that renders a monetary input field in the Shopify admin interface. This component allows merchants to enter currency amounts with automatic formatting, decimal precision, and validation against minimum and maximum values.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -133098,7 +148247,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "string", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else", "isOptional": true }, @@ -133107,7 +148256,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -133120,20 +148269,29 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "currencyCode", + "value": "\"auto\" | CurrencyCode", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "defaultValue": "'auto'", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -133141,7 +148299,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -133158,8 +148316,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -133194,7 +148352,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -133202,7 +148360,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -133210,8 +148368,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -133219,7 +148377,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -133228,7 +148386,7 @@ "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum monetary value allowed in the field.", "defaultValue": "Infinity", "isOptional": true }, @@ -133237,7 +148395,7 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum monetary value allowed in the field.", "defaultValue": "-Infinity", "isOptional": true }, @@ -133246,7 +148404,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -133254,7 +148412,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -133262,7 +148420,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -133271,7 +148429,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -133280,7 +148438,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -133293,6 +148451,14 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -133302,13 +148468,19 @@ "isOptional": true } ], - "value": "declare class MoneyField\n extends PreactFieldElement\n implements MoneyFieldProps\n{\n accessor max: MoneyFieldProps['max'];\n accessor min: MoneyFieldProps['min'];\n /**\n * The current monetary value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string representing the amount in the store's currency.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class MoneyField extends MoneyFieldBase implements MoneyFieldProps {\n constructor();\n}" + }, + "CurrencyCode": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CurrencyCode", + "value": "'USD' | 'EUR' | 'GBP' | 'CAD' | 'AFN' | 'ALL' | 'DZD' | 'AOA' | 'ARS' | 'AMD' | 'AWG' | 'AUD' | 'BBD' | 'AZN' | 'BDT' | 'BSD' | 'BHD' | 'BIF' | 'BZD' | 'BMD' | 'BTN' | 'BAM' | 'BRL' | 'BOB' | 'BWP' | 'BND' | 'BGN' | 'MMK' | 'KHR' | 'CVE' | 'KYD' | 'XAF' | 'CLP' | 'CNY' | 'COP' | 'KMF' | 'CDF' | 'CRC' | 'HRK' | 'CZK' | 'DKK' | 'DOP' | 'XCD' | 'EGP' | 'ETB' | 'XPF' | 'FJD' | 'GMD' | 'GHS' | 'GTQ' | 'GYD' | 'GEL' | 'HTG' | 'HNL' | 'HKD' | 'HUF' | 'ISK' | 'INR' | 'IDR' | 'ILS' | 'IQD' | 'JMD' | 'JPY' | 'JEP' | 'JOD' | 'KZT' | 'KES' | 'KWD' | 'KGS' | 'LAK' | 'LVL' | 'LBP' | 'LSL' | 'LRD' | 'LTL' | 'MGA' | 'MKD' | 'MOP' | 'MWK' | 'MVR' | 'MXN' | 'MYR' | 'MUR' | 'MDL' | 'MAD' | 'MNT' | 'MZN' | 'NAD' | 'NPR' | 'ANG' | 'NZD' | 'NIO' | 'NGN' | 'NOK' | 'OMR' | 'PAB' | 'PKR' | 'PGK' | 'PYG' | 'PEN' | 'PHP' | 'PLN' | 'QAR' | 'RON' | 'RUB' | 'RWF' | 'WST' | 'SAR' | 'RSD' | 'SCR' | 'SGD' | 'SDG' | 'SYP' | 'ZAR' | 'KRW' | 'SSP' | 'SBD' | 'LKR' | 'SRD' | 'SZL' | 'SEK' | 'CHF' | 'TWD' | 'THB' | 'TZS' | 'TTD' | 'TND' | 'TRY' | 'TMT' | 'UGX' | 'UAH' | 'AED' | 'UYU' | 'UZS' | 'VUV' | 'VND' | 'XOF' | 'YER' | 'ZMW' | 'BYN' | 'BYR' | 'DJF' | 'ERN' | 'FKP' | 'GIP' | 'GNF' | 'IRR' | 'KID' | 'LYD' | 'MRU' | 'SLL' | 'SHP' | 'SOS' | 'STD' | 'STN' | 'TJS' | 'TOP' | 'VED' | 'VEF' | 'VES' | 'XXX'", + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -133331,7 +148503,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -133339,7 +148511,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -133347,7 +148519,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -133355,11 +148527,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -133371,15 +148543,14 @@ "MoneyFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "MoneyFieldEvents", - "description": "The money field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the money field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -133387,7 +148558,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the money field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -133395,7 +148566,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the money field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -133403,27 +148574,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the money field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface MoneyFieldEvents {\n /**\n * A callback fired when the money field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the money field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the money field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the money field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface MoneyFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -133539,18 +148708,34 @@ "NumberField": { "filePath": "src/surfaces/admin/components.ts", "name": "NumberField", - "description": "Configure the following properties on the number field component.", - "isPublicDocs": true, + "description": "The number field custom element class that renders a numeric input field in the Shopify admin interface. This component allows merchants to enter numbers with automatic validation and prefix/suffix display.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -133574,7 +148759,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | NumberAutocompleteField | `section-${string} one-time-code` | `section-${string} cc-number` | `section-${string} cc-csc` | \"shipping one-time-code\" | \"shipping cc-number\" | \"shipping cc-csc\" | \"billing one-time-code\" | \"billing cc-number\" | \"billing cc-csc\" | `section-${string} shipping one-time-code` | `section-${string} shipping cc-number` | `section-${string} shipping cc-csc` | `section-${string} billing one-time-code` | `section-${string} billing cc-number` | `section-${string} billing cc-csc`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else", "isOptional": true }, @@ -133583,7 +148768,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -133601,15 +148786,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -133617,7 +148802,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -133634,8 +148819,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -133670,7 +148855,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -133678,7 +148863,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inputMode", "value": "\"decimal\" | \"numeric\"", - "description": "The type of virtual keyboard to display on mobile devices.\n\n- `decimal`: Shows a numeric keyboard with a decimal point, suitable for prices or measurements.\n- `numeric`: Shows a numeric keyboard without a decimal point, suitable for whole numbers like quantities.\n\nLearn more about the [inputmode attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode).", + "description": "The input mode hint for mobile keyboards. Available values include:\n- `numeric`: Shows a numeric keypad optimized for entering numbers\n- `decimal`: Shows a numeric keypad with decimal point support\n- `tel`: Shows a telephone keypad", "defaultValue": "'decimal'", "isOptional": true }, @@ -133687,7 +148872,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -133695,8 +148880,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -133704,7 +148889,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -133713,7 +148898,7 @@ "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum numeric value allowed in the field.", "defaultValue": "Infinity", "isOptional": true }, @@ -133722,7 +148907,7 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum numeric value allowed in the field.", "defaultValue": "-Infinity", "isOptional": true }, @@ -133731,7 +148916,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -133739,7 +148924,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -133747,7 +148932,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the user's input, such as a currency symbol.", "defaultValue": "''", "isOptional": true }, @@ -133756,7 +148941,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -133765,7 +148950,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -133774,7 +148959,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -133792,7 +148977,7 @@ "syntaxKind": "PropertyDeclaration", "name": "step", "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "description": "The granularity that the value must adhere to, or the keyword `any`. This controls the increment/decrement step size.", "defaultValue": "1", "isOptional": true }, @@ -133801,10 +148986,18 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the user's input, such as a unit of measurement.", "defaultValue": "''", "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -133814,21 +149007,19 @@ "isOptional": true } ], - "value": "declare class NumberField\n extends PreactFieldElement\n implements NumberFieldProps\n{\n /**\n * The current numeric value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string (decimal or integer).\n */\n get value(): string;\n set value(value: string);\n accessor inputMode: NumberFieldProps['inputMode'];\n accessor step: NumberFieldProps['step'];\n accessor max: NumberFieldProps['max'];\n accessor min: NumberFieldProps['min'];\n accessor prefix: NumberFieldProps['prefix'];\n accessor suffix: NumberFieldProps['suffix'];\n constructor();\n}" + "value": "declare class NumberField extends NumberFieldBase implements NumberFieldProps {\n constructor();\n}" }, "NumberAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "NumberAutocompleteField", "value": "'one-time-code' | 'cc-number' | 'cc-csc'", - "description": "Represents autocomplete values that are valid for number input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for numeric inputs.\n\nAvailable values:\n- `one-time-code` - One-time codes for authentication (OTP, 2FA codes)\n- `cc-number` - Credit card number\n- `cc-csc` - Credit card security code (CVV/CVC)", - "isPublicDocs": true + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -133851,7 +149042,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -133859,7 +149050,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -133867,7 +149058,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -133875,11 +149066,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -133891,15 +149082,14 @@ "NumberFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "NumberFieldEvents", - "description": "The number field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the number field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -133907,7 +149097,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the number field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -133915,7 +149105,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the number field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -133923,27 +149113,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the number field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface NumberFieldEvents {\n /**\n * A callback fired when the number field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the number field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the number field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the number field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface NumberFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -134060,19 +149248,18 @@ "OrderedListSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "OrderedListSlots", - "description": "The ordered list component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The list entries displayed within the ordered list, where each item is numbered sequentially. Only accepts list item components as children. Each list item represents a single numbered entry in the sequence.", + "description": "The items in the ordered list. Only list item components are accepted.", "isOptional": true } ], - "value": "export interface OrderedListSlots {\n /**\n * The list entries displayed within the ordered list, where each item is numbered sequentially. Only accepts list item components as children. Each list item represents a single numbered entry in the sequence.\n */\n children?: HTMLElement;\n}" + "value": "export interface OrderedListSlots {\n /**\n * The items in the ordered list. Only list item components are accepted.\n */\n children?: HTMLElement;\n}" } } }, @@ -134084,9 +149271,25 @@ "ListItem": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItem", - "description": "The list item component represents a single entry within an ordered list or unordered list. Use list item to structure individual points, steps, or items within a list, with each item automatically receiving appropriate list markers (bullets or numbers) from its parent list.\n\nList item must be used as a direct child of ordered list or unordered list components. Each list item can contain text, inline formatting, or other components to create rich list content.", - "isPublicDocs": true, + "description": "A component that represents a single item within an ordered list or unordered list.\n\nUse list item as a child of ordered list or unordered list to create properly structured and accessible list content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -134110,7 +149313,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -134137,7 +149340,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -134149,15 +149352,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class ListItem extends PreactCustomElement implements ListItemProps {\n constructor();\n}" + "value": "declare class ListItem extends PolarisCustomElement implements ListItemProps {\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -134180,7 +149390,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -134188,7 +149398,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -134196,7 +149406,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -134204,11 +149414,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -134220,19 +149430,18 @@ "ListItemSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItemSlots", - "description": "The list item component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The content displayed within the list item, which represents a single entry in an ordered or unordered list.", + "description": "The content to display inside the list item.", "isOptional": true } ], - "value": "export interface ListItemSlots {\n /**\n * The content displayed within the list item, which represents a single entry in an ordered or unordered list.\n */\n children?: HTMLElement;\n}" + "value": "export interface ListItemSlots {\n /**\n * The content to display inside the list item.\n */\n children?: HTMLElement;\n}" } } } @@ -134315,15 +149524,31 @@ "Paragraph": { "filePath": "src/surfaces/admin/components.ts", "name": "Paragraph", - "description": "Configure the following properties on the paragraph component.", - "isPublicDocs": true, + "description": "A custom element for displaying blocks of text content with consistent spacing and styling for readable body copy. Use Paragraph to render longer text content with proper line height and spacing between paragraphs.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'", "isOptional": true }, @@ -134350,7 +149575,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -134359,7 +149584,7 @@ "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color of the paragraph text.", "defaultValue": "'base'", "isOptional": true }, @@ -134377,7 +149602,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''", "isOptional": true }, @@ -134395,8 +149620,8 @@ "syntaxKind": "PropertyDeclaration", "name": "fontVariantNumeric", "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", - "defaultValue": "'auto'", + "description": "The numeric font variant for the paragraph text.", + "defaultValue": "'auto' - inherit from the parent element", "isOptional": true }, { @@ -134404,7 +149629,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lineClamp", "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", "defaultValue": "Infinity - no truncation is applied", "isOptional": true }, @@ -134413,7 +149638,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -134430,19 +149655,26 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"caution\"", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Paragraph extends PreactCustomElement implements ParagraphProps {\n accessor fontVariantNumeric: ParagraphProps['fontVariantNumeric'];\n accessor lineClamp: ParagraphProps['lineClamp'];\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: ParagraphProps['tone'];\n\n accessor color: ParagraphProps['color'];\n accessor dir: ParagraphProps['dir'];\n accessor accessibilityVisibility: ParagraphProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Paragraph extends ParagraphBase implements ParagraphProps {\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: ParagraphProps['tone'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -134465,7 +149697,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -134473,7 +149705,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -134481,7 +149713,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -134489,11 +149721,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -134505,19 +149737,18 @@ "ParagraphSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ParagraphSlots", - "description": "The paragraph component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The paragraph text content displayed within the paragraph component, which presents a block of related text with appropriate styling.", + "description": "The content of the paragraph.", "isOptional": true } ], - "value": "export interface ParagraphSlots {\n /**\n * The paragraph text content displayed within the paragraph component, which presents a block of related text with appropriate styling.\n */\n children?: HTMLElement;\n}" + "value": "export interface ParagraphSlots {\n /**\n * The content of the paragraph.\n */\n children?: HTMLElement;\n}" } } } @@ -134685,18 +149916,34 @@ "PasswordField": { "filePath": "src/surfaces/admin/components.ts", "name": "PasswordField", - "description": "Configure the following properties on the password field component.", - "isPublicDocs": true, + "description": "The password field custom element class that renders a password input field in the Shopify admin interface. This component allows merchants to enter passwords securely with characters automatically masked for privacy.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -134720,7 +149967,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | PasswordAutocompleteField | `section-${string} current-password` | `section-${string} new-password` | \"shipping current-password\" | \"shipping new-password\" | \"billing current-password\" | \"billing new-password\" | `section-${string} shipping current-password` | `section-${string} shipping new-password` | `section-${string} billing current-password` | `section-${string} billing new-password`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else", "isOptional": true }, @@ -134729,7 +149976,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -134747,15 +149994,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -134763,7 +150010,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -134780,8 +150027,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -134816,7 +150063,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -134824,7 +150071,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -134832,8 +150079,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -134841,7 +150088,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -134850,7 +150097,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the password.", "defaultValue": "Infinity", "isOptional": true }, @@ -134859,7 +150106,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the password.", "defaultValue": "0", "isOptional": true }, @@ -134868,7 +150115,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -134876,7 +150123,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -134884,7 +150131,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -134893,7 +150140,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -134902,7 +150149,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -134915,30 +150162,36 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security.", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true } ], - "value": "declare class PasswordField\n extends PreactFieldElement\n implements PasswordFieldProps\n{\n accessor maxLength: PasswordFieldProps['maxLength'];\n accessor minLength: PasswordFieldProps['minLength'];\n /**\n * The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class PasswordField\n extends PasswordFieldBase\n implements PasswordFieldProps\n{\n constructor();\n}" }, "PasswordAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PasswordAutocompleteField", "value": "'current-password' | 'new-password'", - "description": "Represents autocomplete values that are valid for password input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for password inputs.\n\nAvailable values:\n- `current-password` - Existing password for login or authentication\n- `new-password` - New password when creating an account or changing password", - "isPublicDocs": true + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -134961,7 +150214,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -134969,7 +150222,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -134977,7 +150230,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -134985,11 +150238,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -135001,15 +150254,14 @@ "PasswordFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "PasswordFieldEvents", - "description": "The password field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the password field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -135017,7 +150269,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the password field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -135025,7 +150277,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the password field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -135033,27 +150285,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the password field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface PasswordFieldEvents {\n /**\n * A callback fired when the password field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the password field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the password field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the password field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface PasswordFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -135204,9 +150454,25 @@ "QueryContainer": { "filePath": "src/surfaces/admin/components.ts", "name": "QueryContainer", - "description": "Configure the following properties on the query container component.", - "isPublicDocs": true, + "description": "A component that sets up a container query context, which lets child elements style themselves based on the container's size instead of the viewport size.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -135230,7 +150496,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -135248,7 +150514,7 @@ "syntaxKind": "PropertyDeclaration", "name": "containerName", "value": "string", - "description": "An identifier for this container that you can reference in CSS container queries to apply styles based on this specific container's size.\n\nAll query container components automatically receive a container name of `s-default`. You can omit the container name in your queries, so `@container (inline-size <= 300px)` is equivalent to `@container s-default (inline-size <= 300px)`.\n\nWhen you provide a custom `containerName`, it's added alongside `s-default`. For example, `containerName=\"product-card\"` results in `s-default product-card` being set on the `container-name` CSS property, allowing you to target this container with `@container product-card (inline-size <= 300px)`.\n\nLearn more about the [container-name property](https://developer.mozilla.org/en-US/docs/Web/CSS/container-name).", + "description": "The name of the container, which you can reference in CSS container queries.", "defaultValue": "''", "isOptional": true }, @@ -135266,7 +150532,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -135278,15 +150544,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class QueryContainer\n extends PreactCustomElement\n implements QueryContainerProps\n{\n accessor containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" + "value": "declare class QueryContainer\n extends PolarisCustomElement\n implements QueryContainerProps\n{\n /**\n * The name of the container, which you can reference in CSS container queries.\n */\n containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -135309,7 +150582,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -135317,7 +150590,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -135325,7 +150598,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -135333,11 +150606,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -135349,19 +150622,18 @@ "QueryContainerSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "QueryContainerSlots", - "description": "The query container component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The content displayed within the query container component, which enables container queries for responsive styling based on the container's size rather than the viewport.", + "description": "The content to display inside the container.", "isOptional": true } ], - "value": "export interface QueryContainerSlots {\n /**\n * The content displayed within the query container component, which enables container queries for responsive styling based on the container's size rather than the viewport.\n */\n children?: HTMLElement;\n}" + "value": "export interface QueryContainerSlots {\n /**\n * The content to display inside the container.\n */\n children?: HTMLElement;\n}" } } } @@ -135438,18 +150710,34 @@ "SearchField": { "filePath": "src/surfaces/admin/components.ts", "name": "SearchField", - "description": "Configure the following properties on the search field component.", - "isPublicDocs": true, + "description": "A search field that lets users enter search queries with a search-specific input type.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -135472,8 +150760,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else", "isOptional": true }, @@ -135482,7 +150770,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -135500,15 +150788,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -135516,7 +150804,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -135533,8 +150821,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -135569,7 +150857,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -135577,7 +150865,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -135585,8 +150873,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -135594,7 +150882,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -135603,7 +150891,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters that can be entered in the field.", "defaultValue": "Infinity", "isOptional": true }, @@ -135612,7 +150900,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters that must be entered for the field to be valid.", "defaultValue": "0", "isOptional": true }, @@ -135621,7 +150909,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -135629,7 +150917,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -135637,7 +150925,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -135646,7 +150934,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -135655,7 +150943,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -135668,30 +150956,36 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true } ], - "value": "declare class SearchField\n extends PreactFieldElement\n implements SearchFieldProps\n{\n accessor maxLength: SearchFieldProps['maxLength'];\n accessor minLength: SearchFieldProps['minLength'];\n /**\n * The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class SearchField extends SearchFieldBase implements SearchFieldProps {\n constructor();\n}" }, "TextAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -135714,7 +151008,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -135722,7 +151016,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -135730,7 +151024,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -135738,11 +151032,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -135754,15 +151048,14 @@ "SearchFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "SearchFieldEvents", - "description": "The search field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the search field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -135770,7 +151063,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the search field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -135778,7 +151071,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the search field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -135786,27 +151079,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the search field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface SearchFieldEvents {\n /**\n * A callback fired when the search field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the search field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the search field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the search field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface SearchFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -135923,15 +151214,31 @@ "Section": { "filePath": "src/surfaces/admin/components.ts", "name": "Section", - "description": "Configure the following properties on the section component.", - "isPublicDocs": true, + "description": "A section is a container that groups related content together with an optional heading.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "The accessibility label for screen readers.", "isOptional": true }, { @@ -135957,7 +151264,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -135984,7 +151291,7 @@ "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The heading text displayed at the top of the section. This heading provides a title for the section's content and automatically uses the appropriate semantic heading level (h2, h3, h4) based on nesting depth to maintain proper document structure.", + "description": "The heading text for the section.", "isOptional": true }, { @@ -135992,7 +151299,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "\"base\" | \"none\"", - "description": "The padding applied to all edges of the element.\n\n- `base`: applies padding that is appropriate for the element. Note that it might result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the section need to span to the edge of the section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "description": "Whether the section has padding.", "defaultValue": "'base'", "isOptional": true }, @@ -136001,7 +151308,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -136013,15 +151320,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Section extends PreactCustomElement implements SectionProps {\n constructor();\n /** @private */\n connectedCallback(): void;\n accessor accessibilityLabel: SectionProps['accessibilityLabel'];\n accessor heading: SectionProps['heading'];\n accessor padding: SectionProps['padding'];\n}" + "value": "declare class Section extends SectionBase implements SectionProps {\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -136044,7 +151358,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -136052,7 +151366,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -136060,7 +151374,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -136068,11 +151382,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -136084,19 +151398,18 @@ "SectionSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "SectionSlots", - "description": "The section component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The content displayed within the section component, which groups related elements together in a logical unit with an optional heading.", + "description": "The child elements to render inside the section.", "isOptional": true } ], - "value": "export interface SectionSlots {\n /**\n * The content displayed within the section component, which groups related elements together in a logical unit with an optional heading.\n */\n children?: HTMLElement;\n}" + "value": "export interface SectionSlots {\n /**\n * The child elements to render inside the section.\n */\n children?: HTMLElement;\n}" } } } @@ -136230,13 +151543,20 @@ "Select": { "filePath": "src/surfaces/admin/components.ts", "name": "Select", - "description": "Configure the following properties on the select component.", - "isPublicDocs": true, + "description": "A select dropdown that lets users choose one option from a list.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@hasInitialValueSymbol@12030", + "name": "__@hasInitialValueSymbol@17471", "value": "boolean", "description": "", "isPrivate": true, @@ -136245,7 +151565,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, @@ -136254,9 +151574,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@usedFirstOptionSymbol@12029", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@usedFirstOptionSymbol@17470", "value": "boolean", - "description": "A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n\nThis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.", + "description": "used to determine if no value or defaultValue was set, in which case the first non-disabled option was used\n\nthis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form", "isPrivate": true, "isOptional": true }, @@ -136283,7 +151612,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -136300,8 +151629,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the select.", "isOptional": true }, { @@ -136309,7 +151638,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -136326,8 +151655,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "An error message that's displayed below the select when validation fails.", "isOptional": true }, { @@ -136343,8 +151672,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field.", "isOptional": true }, { @@ -136352,15 +151681,15 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "The text that describes what the select is for.", "isOptional": true }, { @@ -136368,7 +151697,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'", "isOptional": true }, @@ -136377,7 +151706,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -136385,7 +151714,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "Text that appears in the select when no option is selected to provide a hint about what to choose.", "isOptional": true }, { @@ -136393,7 +151722,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -136402,7 +151731,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether an option must be selected before the form can be submitted.", "defaultValue": "false", "isOptional": true }, @@ -136415,22 +151744,36 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component.", + "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected Option component.", "isOptional": true } ], - "value": "declare class Select extends PreactInputElement implements SelectProps {\n accessor icon: SelectProps['icon'];\n accessor details: SelectProps['details'];\n accessor error: SelectProps['error'];\n accessor label: SelectProps['label'];\n accessor placeholder: SelectProps['placeholder'];\n accessor required: SelectProps['required'];\n accessor labelAccessibilityVisibility: SelectProps['labelAccessibilityVisibility'];\n /** @private */\n connectedCallback(): void;\n /**\n * A lifecycle callback that fires when the component is removed from the DOM. Performs cleanup operations.\n * @private\n */\n disconnectedCallback(): void;\n constructor();\n /**\n * A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n *\n * This is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.\n * @private\n */\n [usedFirstOptionSymbol]: boolean;\n /**\n * @private\n */\n [hasInitialValueSymbol]: boolean;\n /**\n * The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component.\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n}" + "value": "declare class Select extends SelectBase implements SelectProps {\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -136453,7 +151796,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -136461,7 +151804,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -136469,7 +151812,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -136477,11 +151820,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -136493,15 +151836,14 @@ "SelectEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "SelectEvents", - "description": "The select component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the select value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -136509,27 +151851,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the select.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface SelectEvents {\n /**\n * A callback fired when the select value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the select.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n}" + "value": "export interface SelectEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -136541,19 +151881,18 @@ "SelectSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "SelectSlots", - "description": "The select component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The selectable options displayed in the dropdown list. Accepts option components for individual selectable items, and option group components to organize related options into logical groups with labels.", + "description": "The selectable options displayed in the dropdown list.\n\nAccepts option components for individual selectable items, and option group components to organize related options into logical groups with labels.", "isOptional": true } ], - "value": "export interface SelectSlots {\n /**\n * The selectable options displayed in the dropdown list. Accepts option components for individual selectable items, and option group components to organize related options into logical groups with labels.\n */\n children?: HTMLElement;\n}" + "value": "export interface SelectSlots {\n /**\n * The selectable options displayed in the dropdown list.\n *\n * Accepts option components for individual selectable items, and option group components to organize related options into logical groups with labels.\n */\n children?: HTMLElement;\n}" } } }, @@ -136565,9 +151904,25 @@ "Option": { "filePath": "src/surfaces/admin/components.ts", "name": "Option", - "description": "Represents a single option within a select component. Use only as a child of s-select components.", - "isPublicDocs": true, + "description": "A single option within a select dropdown that users can choose.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -136591,7 +151946,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -136609,7 +151964,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the option should be selected when it's first rendered.", "defaultValue": "false", "isOptional": true }, @@ -136618,7 +151973,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the option is disabled and can't be selected.", "defaultValue": "false", "isOptional": true }, @@ -136636,7 +151991,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -136645,7 +152000,7 @@ "syntaxKind": "PropertyDeclaration", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the option is currently selected.", "defaultValue": "false", "isOptional": true }, @@ -136658,22 +152013,29 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\".", + "description": "The value that's submitted with the form when this option is selected.", "isOptional": true } ], - "value": "declare class Option extends PreactCustomElement implements OptionProps {\n accessor selected: OptionProps['selected'];\n accessor defaultSelected: OptionProps['defaultSelected'];\n accessor value: OptionProps['value'];\n accessor disabled: OptionProps['disabled'];\n constructor();\n}" + "value": "declare class Option extends PolarisCustomElement implements OptionProps {\n /**\n * Whether the option is currently selected.\n */\n selected: OptionProps['selected'];\n /**\n * Whether the option should be selected when it's first rendered.\n */\n defaultSelected: OptionProps['defaultSelected'];\n /**\n * The value that's submitted with the form when this option is selected.\n */\n value: OptionProps['value'];\n /**\n * Whether the option is disabled and can't be selected.\n */\n disabled: OptionProps['disabled'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -136696,7 +152058,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -136704,7 +152066,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -136712,7 +152074,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -136720,11 +152082,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -136736,19 +152098,18 @@ "OptionSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionSlots", - "description": "The option component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The text or elements displayed as the option label, which identifies the selectable choice to users in a dropdown or selection list.", + "description": "The content that's used as the option label, displayed in the dropdown list.", "isOptional": true } ], - "value": "export interface OptionSlots {\n /**\n * The text or elements displayed as the option label, which identifies the selectable choice to users in a dropdown or selection list.\n */\n children?: HTMLElement;\n}" + "value": "export interface OptionSlots {\n /**\n * The content that's used as the option label, displayed in the dropdown list.\n */\n children?: HTMLElement;\n}" } } }, @@ -136760,9 +152121,25 @@ "OptionGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionGroup", - "description": "Represents a group of options within a select component. Use only as a child of `s-select` components.", - "isPublicDocs": true, + "description": "A group of related options within a select dropdown, displayed with a label.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -136786,7 +152163,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -136804,7 +152181,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the options within this group can be selected or not.", + "description": "Whether all options in the group are disabled and can't be selected.", "defaultValue": "false", "isOptional": true }, @@ -136822,7 +152199,7 @@ "syntaxKind": "PropertyDeclaration", "name": "label", "value": "string", - "description": "The user-facing label for this group of options.", + "description": "The text that describes what this group of options represents.", "isOptional": true }, { @@ -136830,7 +152207,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -136842,15 +152219,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class OptionGroup\n extends PreactCustomElement\n implements OptionGroupProps\n{\n accessor disabled: OptionGroupProps['disabled'];\n accessor label: OptionGroupProps['label'];\n constructor();\n}" + "value": "declare class OptionGroup\n extends PolarisCustomElement\n implements OptionGroupProps\n{\n /**\n * Whether all options in the group are disabled and can't be selected.\n */\n disabled: OptionGroupProps['disabled'];\n /**\n * The text that describes what this group of options represents.\n */\n label: OptionGroupProps['label'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -136873,7 +152257,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -136881,7 +152265,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -136889,7 +152273,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -136897,11 +152281,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -136913,8 +152297,7 @@ "OptionGroupSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionGroupSlots", - "description": "The option group component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -137092,15 +152475,31 @@ "Spinner": { "filePath": "src/surfaces/admin/components.ts", "name": "Spinner", - "description": "Configure the following properties on the spinner component.", - "isPublicDocs": true, + "description": "A component that displays an animated loading indicator to show that content is currently being processed.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the spinner for assistive technologies.", "isOptional": true }, { @@ -137126,7 +152525,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -137153,7 +152552,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -137171,18 +152570,25 @@ "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the loading spinner.\n\n- `base`: Default size suitable for inline loading indicators or standard UI contexts.\n- `large`: Larger spinner for more prominent loading states.\n- `large-100`: Extra large spinner for full-page or emphasized loading states.", + "description": "The size of the spinner.", "defaultValue": "'base'", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Spinner extends PreactCustomElement implements SpinnerProps {\n accessor accessibilityLabel: string;\n accessor size: SpinnerProps['size'];\n constructor();\n}" + "value": "declare class Spinner extends PolarisCustomElement implements SpinnerProps {\n /**\n * A label that describes the spinner for assistive technologies.\n */\n accessibilityLabel: string;\n /**\n * The size of the spinner.\n */\n size: SpinnerProps['size'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -137205,7 +152611,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -137213,7 +152619,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -137221,7 +152627,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -137229,11 +152635,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } } @@ -137350,15 +152756,31 @@ "Stack": { "filePath": "src/surfaces/admin/components.ts", "name": "Stack", - "description": "Configure the following properties on the stack component.", - "isPublicDocs": true, + "description": "A stack is a layout component that arranges its children in a single direction with controlled spacing and alignment.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { @@ -137366,7 +152788,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'", "isOptional": true }, @@ -137375,7 +152797,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -137393,7 +152815,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "AlignContentKeyword", - "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.", "defaultValue": "'normal'", "isOptional": true }, @@ -137402,7 +152824,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "AlignItemsKeyword", - "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).", "defaultValue": "'normal'", "isOptional": true }, @@ -137420,7 +152842,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'", "isOptional": true }, @@ -137429,7 +152851,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'", "isOptional": true }, @@ -137438,7 +152860,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -137459,7 +152881,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -137468,7 +152890,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'", "isOptional": true }, @@ -137477,7 +152899,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -137486,7 +152908,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -137495,7 +152917,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -137504,7 +152926,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between columns in the stack.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -137522,7 +152944,7 @@ "syntaxKind": "PropertyDeclaration", "name": "direction", "value": "MaybeResponsive<\"inline\" | \"block\">", - "description": "The direction in which the stack's children are placed within the stack.\n\nAccepts:\n- A single value, either `inline` or `block`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported direction values as a query value", + "description": "The direction in which the stack's children are arranged.", "defaultValue": "'block'", "isOptional": true }, @@ -137540,7 +152962,7 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'", "isOptional": true }, @@ -137549,7 +152971,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between the stack's children.", "defaultValue": "'none'", "isOptional": true }, @@ -137558,7 +152980,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'", "isOptional": true }, @@ -137567,7 +152989,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "JustifyContentKeyword", - "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).", "defaultValue": "'normal'", "isOptional": true }, @@ -137576,7 +152998,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -137585,7 +153007,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -137594,7 +153016,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -137603,7 +153025,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -137612,7 +153034,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'", "isOptional": true }, @@ -137621,7 +153043,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'", "isOptional": true }, @@ -137630,7 +153052,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -137639,7 +153061,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -137648,7 +153070,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -137657,7 +153079,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -137666,7 +153088,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -137675,7 +153097,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -137684,7 +153106,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -137693,7 +153115,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between rows in the stack.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -137705,192 +153127,178 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n accessor direction: StackProps['direction'];\n accessor justifyContent: StackProps['justifyContent'];\n accessor alignItems: StackProps['alignItems'];\n accessor alignContent: StackProps['alignContent'];\n accessor gap: StackProps['gap'];\n accessor rowGap: StackProps['rowGap'];\n accessor columnGap: StackProps['columnGap'];\n}" + "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n /**\n * The direction in which the stack's children are arranged.\n */\n direction: StackProps['direction'];\n /**\n * Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n */\n justifyContent: StackProps['justifyContent'];\n /**\n * Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n */\n alignItems: StackProps['alignItems'];\n /**\n * Controls the distribution of lines along the block axis when content wraps into multiple lines.\n */\n alignContent: StackProps['alignContent'];\n /**\n * The spacing between the stack's children.\n */\n gap: StackProps['gap'];\n /**\n * The spacing between rows in the stack.\n */\n rowGap: StackProps['rowGap'];\n /**\n * The spacing between columns in the stack.\n */\n columnGap: StackProps['columnGap'];\n}" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "JustifyContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyContentKeyword", "value": "'normal' | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", - "isPublicDocs": true + "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container." }, "ContentDistribution": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentDistribution", "value": "'space-between' | 'space-around' | 'space-evenly' | 'stretch'", - "description": "Defines how space is distributed between and around content items in flex and grid layouts.\n- `space-between`: Distributes items evenly with the first item at the start and last at the end.\n- `space-around`: Distributes items evenly with equal space around each item.\n- `space-evenly`: Distributes items evenly with equal space between them.\n- `stretch`: Stretches items to fill the container.", - "isPublicDocs": true + "description": "" }, "OverflowPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "OverflowPosition", "value": "`unsafe ${ContentPosition}` | `safe ${ContentPosition}`", - "description": "Represents content positioning with overflow behavior control. Use `safe` to prevent content from becoming inaccessible when it overflows, or `unsafe` to allow overflow regardless of accessibility.", - "isPublicDocs": true + "description": "" }, "ContentPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentPosition", "value": "'center' | 'start' | 'end'", - "description": "Defines the position of content along an axis.\n- `center`: Centers the content.\n- `start`: Aligns content to the start.\n- `end`: Aligns content to the end.", - "isPublicDocs": true + "description": "" }, "AlignItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Align items sets the align-self value on all direct children as a group.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isPublicDocs": true + "description": "Align items sets the align-self value on all direct children as a group." }, "BaselinePosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BaselinePosition", "value": "'baseline' | 'first baseline' | 'last baseline'", - "description": "Represents baseline alignment positions used to align items relative to their baselines.\n- `baseline`: Aligns to the baseline of the parent.\n- `first baseline`: Aligns to the first baseline of the parent.\n- `last baseline`: Aligns to the last baseline of the parent.", - "isPublicDocs": true + "description": "" }, "AlignContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignContentKeyword", "value": "'normal' | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isPublicDocs": true + "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis." }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "SpacingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SpacingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the spacing size between elements, using the standard size scale or `none` for no spacing.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "AccessibilityRole": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -137898,14 +153306,13 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -137928,7 +153335,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -137936,7 +153343,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -137944,7 +153351,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -137952,11 +153359,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -137968,19 +153375,18 @@ "StackSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "StackSlots", - "description": "The stack component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The child elements displayed within the stack component, which are arranged vertically or horizontally with consistent spacing.", + "description": "The child elements to render inside the stack.", "isOptional": true } ], - "value": "export interface StackSlots {\n /**\n * The child elements displayed within the stack component, which are arranged vertically or horizontally with consistent spacing.\n */\n children?: HTMLElement;\n}" + "value": "export interface StackSlots {\n /**\n * The child elements to render inside the stack.\n */\n children?: HTMLElement;\n}" } } } @@ -138108,24 +153514,40 @@ "Switch": { "filePath": "src/surfaces/admin/components.ts", "name": "Switch", - "description": "Configure the following properties on the switch component.", - "isPublicDocs": true, + "description": "A switch that lets users toggle a setting on or off with a sliding control.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers.", "isOptional": true }, { @@ -138151,7 +153573,7 @@ "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false", "isOptional": true }, @@ -138160,7 +153582,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -138178,7 +153600,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false", "isOptional": true }, @@ -138186,8 +153608,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -138195,7 +153617,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -138212,8 +153634,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -138230,15 +153652,15 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state.", + "value": "any", + "description": "Visual content to use as the control label.", "isOptional": true }, { @@ -138246,7 +153668,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'", "isOptional": true }, @@ -138255,7 +153677,15 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "", "isOptional": true }, { @@ -138263,7 +153693,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -138285,6 +153715,14 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -138294,13 +153732,19 @@ "isOptional": true } ], - "value": "declare class Switch extends PreactCheckboxElement implements SwitchProps {\n accessor labelAccessibilityVisibility: SwitchProps['labelAccessibilityVisibility'];\n constructor();\n}" + "value": "declare class Switch extends SwitchBase implements SwitchProps {\n constructor();\n}" + }, + "CallbackEvent": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CallbackEvent", + "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -138323,7 +153767,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -138331,7 +153775,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -138339,7 +153783,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -138347,11 +153791,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -138363,15 +153807,22 @@ "SwitchEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "SwitchEvents", - "description": "The switch component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "blur", + "value": "CallbackEventListener<'input'>", + "description": "", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the switch value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -138379,27 +153830,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the switch.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface SwitchEvents {\n /**\n * A callback fired when the switch value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the switch.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n}" + "value": "export interface SwitchEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -138566,14 +154015,13 @@ "Table": { "filePath": "src/surfaces/admin/components.ts", "name": "Table", - "description": "Configure the following properties on the table component.", - "isPublicDocs": true, + "description": "A component that displays data in a structured table format that automatically adapts to the available space.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@actualTableVariantSymbol@12105", - "value": "AddedContext", + "name": "__@actualTableVariantSymbol@17550", + "value": "_shopify_admin_web_component_foundations.AddedContext", "description": "", "isPrivate": true, "isOptional": true @@ -138581,8 +154029,34 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@tableHeadersSharedDataSymbol@12106", - "value": "AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@tableHeadersSharedDataSymbol@17551", + "value": "_shopify_admin_web_component_foundations.AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", "description": "", "isPrivate": true, "isOptional": true @@ -138610,7 +154084,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -138637,7 +154111,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hasNextPage", "value": "boolean", - "description": "Whether there's an additional page of data.", + "description": "Whether there's a next page of data that the user can navigate to.", "defaultValue": "false", "isOptional": true }, @@ -138646,7 +154120,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hasPreviousPage", "value": "boolean", - "description": "Whether there's a previous page of data.", + "description": "Whether there's a previous page of data that the user can navigate to.", "defaultValue": "false", "isOptional": true }, @@ -138655,7 +154129,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table. When `true`, the table might be in an inert state that prevents user interaction.", + "description": "Whether the table is currently in a loading state.", "defaultValue": "false", "isOptional": true }, @@ -138664,7 +154138,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paginate", "value": "boolean", - "description": "Whether to use pagination controls.", + "description": "Whether the pagination controls are displayed.", "defaultValue": "false", "isOptional": true }, @@ -138673,7 +154147,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -138688,85 +154162,50 @@ }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "variant", - "value": "\"auto\" | \"list\"", - "description": "The layout variant of the table component.\n\n- `list`: Always displays as a list layout.\n- `table`: Always displays as a traditional table layout.\n- `auto`: Automatically displays as a table on wide screens and as a list on narrow screens.", - "defaultValue": "'auto'", - "isOptional": true - } - ], - "value": "declare class Table extends PreactCustomElement implements TableProps {\n accessor variant: TableProps['variant'];\n accessor loading: TableProps['loading'];\n accessor paginate: TableProps['paginate'];\n accessor hasPreviousPage: TableProps['hasPreviousPage'];\n accessor hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" - }, - "AddedContext": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AddedContext", - "description": "", - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "addEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", - "description": "The **`addEventListener()`** method of the EventTarget interface sets up a function that will be called whenever the specified event is delivered to the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener)", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "dispatchEvent", - "value": "(event: Event) => boolean", - "description": "The **`dispatchEvent()`** method of the EventTarget sends an Event to the object, (synchronously) invoking the affected event listeners in the appropriate order.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/dispatchEvent)", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "removeEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", - "description": "The **`removeEventListener()`** method of the EventTarget interface removes an event listener previously registered with EventTarget.addEventListener() from the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/removeEventListener)", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "T", - "description": "The current context value.\n\nThe new context value to set, which will notify all consumers.", + "syntaxKind": "PropertyDeclaration", + "name": "variant", + "value": "\"auto\" | \"list\"", + "description": "The display variant of the table.", + "defaultValue": "'auto'", "isOptional": true } ], - "value": "declare class AddedContext extends EventTarget {\n constructor(defaultValue: T);\n /**\n * The current context value.\n */\n get value(): T;\n /**\n * The new context value to set, which will notify all consumers.\n */\n set value(value: T);\n}" + "value": "declare class Table extends PolarisCustomElement implements TableProps {\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The display variant of the table.\n */\n variant: TableProps['variant'];\n /**\n * Whether the table is currently in a loading state.\n */\n loading: TableProps['loading'];\n /**\n * Whether the pagination controls are displayed.\n */\n paginate: TableProps['paginate'];\n /**\n * Whether there's a previous page of data that the user can navigate to.\n */\n hasPreviousPage: TableProps['hasPreviousPage'];\n /**\n * Whether there's a next page of data that the user can navigate to.\n */\n hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: _shopify_admin_web_component_foundations.AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: _shopify_admin_web_component_foundations.AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" }, "ActualTableVariant": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ActualTableVariant", "value": "'table' | 'list'", - "description": "Represents the actual rendered variant of a table component.\n- `table`: Displays as a traditional table layout.\n- `list`: Displays as a list layout.", - "isPublicDocs": true + "description": "" }, "ListSlotType": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ListSlotType", "value": "'primary' | 'secondary' | 'kicker' | 'inline' | 'labeled'", - "description": "Represents the semantic type of content slots within list items.\n\n- `primary`: The main content or title of the list item.\n- `secondary`: Supporting or descriptive content below the primary content.\n- `kicker`: A small label or tag displayed above the primary content.\n- `inline`: Content displayed inline with the primary content.\n- `labeled`: Content with an associated label.", - "isPublicDocs": true + "description": "" }, "HeaderFormat": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -138789,7 +154228,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -138797,7 +154236,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -138805,7 +154244,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -138813,11 +154252,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -138829,15 +154268,14 @@ "TableSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TableSlots", - "description": "The table component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The table structure defining headers and data rows.\n\nAccepts table header row (for column headers) and table body (for data rows) components. Structure your table with a table header row first, followed by table body.", + "description": "The content to display inside the table, which should include table header row, table body, and table row components.", "isOptional": true }, { @@ -138845,11 +154283,11 @@ "syntaxKind": "PropertySignature", "name": "filters", "value": "HTMLElement", - "description": "Filter controls displayed above the table.\n\nAccepts input components like search field or select for filtering table data. These controls appear in a dedicated area above the table content.", + "description": "Additional filters to display in the table. For example, you can use the search field component to filter the table data.", "isOptional": true } ], - "value": "export interface TableSlots {\n /**\n * The table structure defining headers and data rows.\n *\n * Accepts table header row (for column headers) and table body (for data rows) components. Structure your table with a table header row first, followed by table body.\n */\n children?: HTMLElement;\n /**\n * Filter controls displayed above the table.\n *\n * Accepts input components like search field or select for filtering table data. These controls appear in a dedicated area above the table content.\n */\n filters?: HTMLElement;\n}" + "value": "export interface TableSlots {\n /**\n * The content to display inside the table, which should include table header row, table body, and table row components.\n */\n children?: HTMLElement;\n /**\n * Additional filters to display in the table. For example, you can use the search field component to filter the table data.\n */\n filters?: HTMLElement;\n}" } } }, @@ -138861,15 +154299,14 @@ "TableEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "TableEvents", - "description": "The table component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "nextpage", "value": "CallbackEventListener | null", - "description": "A callback fired when the user navigates to the next page.", + "description": "The event listener that's called when the user navigates to the next page.", "isOptional": true }, { @@ -138877,27 +154314,25 @@ "syntaxKind": "PropertySignature", "name": "previouspage", "value": "CallbackEventListener | null", - "description": "A callback fired when the user navigates to the previous page.", + "description": "The event listener that's called when the user navigates to the previous page.", "isOptional": true } ], - "value": "export interface TableEvents {\n /**\n * A callback fired when the user navigates to the previous page.\n */\n previouspage: CallbackEventListener | null = null;\n /**\n * A callback fired when the user navigates to the next page.\n */\n nextpage: CallbackEventListener | null = null;\n}" + "value": "export interface TableEvents {\n /**\n * The event listener that's called when the user navigates to the previous page.\n */\n previouspage: CallbackEventListener | null = null;\n /**\n * The event listener that's called when the user navigates to the next page.\n */\n nextpage: CallbackEventListener | null = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -138909,9 +154344,34 @@ "TableBody": { "filePath": "src/surfaces/admin/components.ts", "name": "TableBody", - "description": "The table body component represents the main content area of a table, containing the data rows. Use table body as a child of table to structure your table data, with each table row within the body representing a single record or entry.\n\nTable body must contain table row components, which in turn contain table cell components for the actual data values.", - "isPublicDocs": true, + "description": "A component that wraps the body content of a table, which contains the data rows.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -138935,7 +154395,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -138962,7 +154422,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -138974,15 +154434,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class TableBody extends PreactCustomElement implements TableBodyProps {\n constructor();\n}" + "value": "declare class TableBody extends PolarisCustomElement implements TableBodyProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -139005,7 +154472,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -139013,7 +154480,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -139021,7 +154488,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -139029,11 +154496,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -139045,19 +154512,18 @@ "TableBodySlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TableBodySlots", - "description": "The table body component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The data rows displayed in the table body.\n\nAccepts table row components, with each row representing a single record or entry in the table.", + "description": "The body content of the table, which should include table row components. This content might not have any semantic meaning when the table uses the `list` variant.", "isOptional": true } ], - "value": "export interface TableBodySlots {\n /**\n * The data rows displayed in the table body.\n *\n * Accepts table row components, with each row representing a single record or entry in the table.\n */\n children?: HTMLElement;\n}" + "value": "export interface TableBodySlots {\n /**\n * The body content of the table, which should include table row components. This content might not have any semantic meaning when the table uses the `list` variant.\n */\n children?: HTMLElement;\n}" } } }, @@ -139069,18 +154535,43 @@ "TableCell": { "filePath": "src/surfaces/admin/components.ts", "name": "TableCell", - "description": "The table cell component represents a single data cell within a table row. Use table cell as a child of table row to display individual data values, with each cell corresponding to a column in the table.\n\nTable cell automatically inherits styling and alignment from its parent table structure and supports text content or other inline components.", - "isPublicDocs": true, + "description": "A component that represents a single cell in a table row, which displays data in a format that's determined by its column header.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", - "name": "__@headerFormatSymbol@12128", + "name": "__@headerFormatSymbol@17578", "value": "HeaderFormat", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -139104,7 +154595,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -139131,7 +154622,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -139143,23 +154634,30 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class TableCell extends PreactCustomElement implements TableCellProps {\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" + "value": "declare class TableCell extends PolarisCustomElement implements TableCellProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" }, "HeaderFormat": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -139182,7 +154680,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -139190,7 +154688,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -139198,7 +154696,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -139206,11 +154704,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -139222,19 +154720,18 @@ "TableCellSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TableCellSlots", - "description": "The table cell component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The data value displayed in this cell.\n\nAccepts text content or inline components representing the cell's data value.", + "description": "The content to display inside the table cell.", "isOptional": true } ], - "value": "export interface TableCellSlots {\n /**\n * The data value displayed in this cell.\n *\n * Accepts text content or inline components representing the cell's data value.\n */\n children?: HTMLElement;\n}" + "value": "export interface TableCellSlots {\n /**\n * The content to display inside the table cell.\n */\n children?: HTMLElement;\n}" } } }, @@ -139246,9 +154743,34 @@ "TableHeader": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeader", - "description": "The table header component represents a single column header within a table header row. Use table header as a child of table header row to define column headings and optionally enable column sorting.\n\nTable header provides semantic meaning for screen readers and can include sorting controls when configured. Each header corresponds to a column in the table body.", - "isPublicDocs": true, + "description": "A component that defines a column header in a table, which specifies both the header label and how the column's data should be formatted.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -139272,7 +154794,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -139299,7 +154821,7 @@ "syntaxKind": "PropertyDeclaration", "name": "format", "value": "HeaderFormat", - "description": "The format of the column that controls styling and alignment of cell content.", + "description": "The format of the header and its corresponding cells.", "isOptional": true }, { @@ -139307,7 +154829,7 @@ "syntaxKind": "PropertyDeclaration", "name": "listSlot", "value": "ListSlotType", - "description": "The content designation for this column when the table displays in list variant on mobile devices.", + "description": "The slot where this header's data appears when the table is shown in list view.", "defaultValue": "'labeled'", "isOptional": true }, @@ -139316,7 +154838,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -139328,31 +154850,37 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class TableHeader\n extends PreactCustomElement\n implements TableHeaderProps\n{\n accessor listSlot: TableHeaderProps['listSlot'];\n accessor format: TableHeaderProps['format'];\n constructor();\n}" + "value": "declare class TableHeader\n extends PolarisCustomElement\n implements TableHeaderProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The slot where this header's data appears when the table is shown in list view.\n */\n listSlot: TableHeaderProps['listSlot'];\n /**\n * The format of the header and its corresponding cells.\n */\n format: TableHeaderProps['format'];\n constructor();\n}" }, "ListSlotType": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ListSlotType", "value": "'primary' | 'secondary' | 'kicker' | 'inline' | 'labeled'", - "description": "Represents the semantic type of content slots within list items.\n\n- `primary`: The main content or title of the list item.\n- `secondary`: Supporting or descriptive content below the primary content.\n- `kicker`: A small label or tag displayed above the primary content.\n- `inline`: Content displayed inline with the primary content.\n- `labeled`: Content with an associated label.", - "isPublicDocs": true + "description": "" }, "HeaderFormat": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -139375,7 +154903,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -139383,7 +154911,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -139391,7 +154919,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -139399,11 +154927,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -139415,19 +154943,18 @@ "TableHeaderSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeaderSlots", - "description": "The table header component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The column heading text.\n\nThis text labels the column in table variant and appears as a label for data in list variant.", + "description": "The heading of the column when the table uses the `table` variant, and the label of its data when the table uses the `list` variant.", "isOptional": true } ], - "value": "export interface TableHeaderSlots {\n /**\n * The column heading text.\n *\n * This text labels the column in table variant and appears as a label for data in list variant.\n */\n children?: HTMLElement;\n}" + "value": "export interface TableHeaderSlots {\n /**\n * The heading of the column when the table uses the `table` variant, and the label of its data when the table uses the `list` variant.\n */\n children?: HTMLElement;\n}" } } }, @@ -139439,9 +154966,34 @@ "TableHeaderRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeaderRow", - "description": "The table header row component represents the header row of a table, containing column headings. Use table header row as the first child of table (before table body) to define the table structure and provide column labels.\n\nTable header row must contain table header components for each column. These headers provide context for the data columns and can support sorting functionality.", - "isPublicDocs": true, + "description": "A component that wraps the header row of a table, which contains the table header components that define the column structure.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -139465,7 +155017,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -139492,7 +155044,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -139504,15 +155056,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class TableHeaderRow\n extends PreactCustomElement\n implements TableHeaderRowProps\n{\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class TableHeaderRow\n extends PolarisCustomElement\n implements TableHeaderRowProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -139535,7 +155094,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -139543,7 +155102,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -139551,7 +155110,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -139559,11 +155118,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -139575,19 +155134,18 @@ "TableHeaderRowSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeaderRowSlots", - "description": "The table header row component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The column headers displayed in the table header row.\n\nAccepts table header components, with each header defining a column and providing its label.", + "description": "The content to display inside the table header row, which should include table header components.", "isOptional": true } ], - "value": "export interface TableHeaderRowSlots {\n /**\n * The column headers displayed in the table header row.\n *\n * Accepts table header components, with each header defining a column and providing its label.\n */\n children?: HTMLElement;\n}" + "value": "export interface TableHeaderRowSlots {\n /**\n * The content to display inside the table header row, which should include table header components.\n */\n children?: HTMLElement;\n}" } } }, @@ -139599,9 +155157,34 @@ "TableRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableRow", - "description": "The table row component represents a single row of data within a table body. Use table row as a child of table body to structure individual records or entries in the table.\n\nTable row must contain table cell components, with each cell representing a data value for the corresponding column. The number of cells should match the number of headers in the table.", - "isPublicDocs": true, + "description": "A component that represents a single row in a table, which contains the data cells.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -139625,7 +155208,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -139634,7 +155217,7 @@ "syntaxKind": "PropertyDeclaration", "name": "clickDelegate", "value": "string", - "description": "The ID of an interactive element, such as `s-link`, in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally.", + "description": "A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector.", "isOptional": true }, { @@ -139660,7 +155243,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -139672,15 +155255,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class TableRow extends PreactCustomElement implements TableRowProps {\n constructor();\n accessor clickDelegate: string;\n}" + "value": "declare class TableRow extends PolarisCustomElement implements TableRowProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /**\n * A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector.\n */\n clickDelegate: string;\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -139703,7 +155293,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -139711,7 +155301,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -139719,7 +155309,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -139727,11 +155317,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -139743,19 +155333,18 @@ "TableRowSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TableRowSlots", - "description": "The table row component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The data cells displayed in this table row.\n\nAccepts table cell components, with each cell containing a data value for the corresponding column.", + "description": "The content to display inside the row, which should include table cell components.", "isOptional": true } ], - "value": "export interface TableRowSlots {\n /**\n * The data cells displayed in this table row.\n *\n * Accepts table cell components, with each cell containing a data value for the corresponding column.\n */\n children?: HTMLElement;\n}" + "value": "export interface TableRowSlots {\n /**\n * The content to display inside the row, which should include table cell components.\n */\n children?: HTMLElement;\n}" } } } @@ -139906,15 +155495,31 @@ "Text": { "filePath": "src/surfaces/admin/components.ts", "name": "Text", - "description": "Configure the following properties on the text component.", - "isPublicDocs": true, + "description": "A custom element for displaying inline or small blocks of text with various visual styles and semantic meanings. Use Text to render short pieces of content with appropriate styling, emphasis, and color treatment.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'", "isOptional": true }, @@ -139941,7 +155546,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -139950,7 +155555,7 @@ "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color of the text.", "defaultValue": "'base'", "isOptional": true }, @@ -139968,7 +155573,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''", "isOptional": true }, @@ -139986,8 +155591,8 @@ "syntaxKind": "PropertyDeclaration", "name": "fontVariantNumeric", "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", - "defaultValue": "'auto'", + "description": "The numeric font variant for the text.", + "defaultValue": "'auto' - inherit from the parent element", "isOptional": true }, { @@ -139995,7 +155600,7 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "The ID of an element this text provides contextual information for.", "isOptional": true }, { @@ -140003,7 +155608,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -140033,15 +155638,22 @@ "description": "The semantic type and styling treatment for the text content.\n\n- `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n- `generic`: Standard text with no special semantic meaning or styling.\n- `address`: Marks the text as contact information, such as a physical or email address.\n- `redundant`: Indicates the text is redundant or duplicated information for screen reader context.", "defaultValue": "'generic'", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Text extends PreactCustomElement implements TextProps {\n accessor fontVariantNumeric: TextProps['fontVariantNumeric'];\n accessor color: TextProps['color'];\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: TextProps['tone'];\n /**\n * The semantic type and styling treatment for the text content.\n *\n * - `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n * - `generic`: Standard text with no special semantic meaning or styling.\n * - `address`: Marks the text as contact information, such as a physical or email address.\n * - `redundant`: Indicates the text is redundant or duplicated information for screen reader context.\n */\n accessor type: TextProps['type'];\n accessor dir: TextProps['dir'];\n accessor accessibilityVisibility: TextProps['accessibilityVisibility'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Text extends TextBase implements TextProps {\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: TextProps['tone'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -140064,7 +155676,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -140072,7 +155684,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -140080,7 +155692,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -140088,11 +155700,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -140104,19 +155716,18 @@ "TextSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TextSlots", - "description": "The text component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The text content displayed within the text component, which applies semantic meaning and styling appropriate to the specified text type.", + "description": "The content of the text.", "isOptional": true } ], - "value": "export interface TextSlots {\n /**\n * The text content displayed within the text component, which applies semantic meaning and styling appropriate to the specified text type.\n */\n children?: HTMLElement;\n}" + "value": "export interface TextSlots {\n /**\n * The content of the text.\n */\n children?: HTMLElement;\n}" } } } @@ -140301,18 +155912,34 @@ "TextArea": { "filePath": "src/surfaces/admin/components.ts", "name": "TextArea", - "description": "Configure the following properties on the text area component.", - "isPublicDocs": true, + "description": "The text area custom element class that renders a multi-line text input field in the Shopify admin interface. This component allows merchants to enter and edit longer text content with support for labels, validation, and length constraints.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -140335,8 +155962,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else", "isOptional": true }, @@ -140345,7 +155972,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -140363,15 +155990,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -140379,7 +156006,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -140396,8 +156023,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -140432,7 +156059,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -140440,7 +156067,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -140448,8 +156075,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -140457,7 +156084,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -140466,7 +156093,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity", "isOptional": true }, @@ -140475,7 +156102,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0", "isOptional": true }, @@ -140484,7 +156111,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -140492,7 +156119,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -140500,7 +156127,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -140509,7 +156136,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -140518,7 +156145,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -140527,7 +156154,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rows", "value": "number", - "description": "A number of visible text lines.", + "description": "The number of visible text lines for the field, controlling its initial height.", "defaultValue": "2", "isOptional": true }, @@ -140540,30 +156167,36 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true } ], - "value": "declare class TextArea\n extends PreactFieldElement\n implements TextAreaProps\n{\n accessor maxLength: TextAreaProps['maxLength'];\n accessor minLength: TextAreaProps['minLength'];\n accessor rows: TextAreaProps['rows'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextArea extends TextAreaBase implements TextAreaProps {\n constructor();\n}" }, "TextAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -140586,7 +156219,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -140594,7 +156227,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -140602,7 +156235,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -140610,11 +156243,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -140626,15 +156259,14 @@ "TextAreaEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "TextAreaEvents", - "description": "The text area component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text area loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -140642,7 +156274,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text area value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -140650,7 +156282,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text area receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -140658,27 +156290,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the text area.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface TextAreaEvents {\n /**\n * A callback fired when the text area value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the text area.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the text area loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the text area receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface TextAreaEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -140812,18 +156442,34 @@ "TextField": { "filePath": "src/surfaces/admin/components.ts", "name": "TextField", - "description": "Configure the following properties on the text field component.", - "isPublicDocs": true, + "description": "The text field custom element class that renders a single-line text input field in the Shopify admin interface. This component allows merchants to enter and edit text with support for labels, validation, icons, and prefix/suffix content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -140846,8 +156492,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else", "isOptional": true }, @@ -140856,7 +156502,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -140874,15 +156520,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -140890,7 +156536,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -140907,8 +156553,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -140942,8 +156588,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\" | AnyString", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "value": "IconType | AnyString", + "description": "An icon to display at the start of the text field, providing visual context for the input. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", "defaultValue": "''", "isOptional": true }, @@ -140952,7 +156598,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -140960,7 +156606,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -140968,8 +156614,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -140977,7 +156623,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -140986,7 +156632,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the merchant can enter in the field. When this limit is reached, the field prevents further input.", "defaultValue": "Infinity", "isOptional": true }, @@ -140995,7 +156641,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation. The field will be considered invalid if the merchant enters fewer characters than this value.", "defaultValue": "0", "isOptional": true }, @@ -141004,7 +156650,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -141012,7 +156658,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -141020,7 +156666,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the merchant's input, such as a currency symbol (`$`) or protocol (`https://`).", "defaultValue": "''", "isOptional": true }, @@ -141029,7 +156675,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -141038,7 +156684,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -141047,7 +156693,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -141065,42 +156711,54 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the merchant's input, such as a unit of measurement (`kg`, `%`) or domain (`.myshopify.com`).", "defaultValue": "''", "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true } ], - "value": "declare class TextField\n extends PreactFieldElement\n implements TextFieldProps\n{\n accessor icon: TextFieldProps['icon'];\n accessor maxLength: TextFieldProps['maxLength'];\n accessor minLength: TextFieldProps['minLength'];\n accessor prefix: TextFieldProps['prefix'];\n accessor suffix: TextFieldProps['suffix'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextField extends TextFieldBase implements TextFieldProps {\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "AnyString": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AnyString", "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true + "description": "Prevents widening string literal types in a union to `string`." }, "TextAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -141123,7 +156781,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -141131,7 +156789,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -141139,7 +156797,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -141147,11 +156805,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -141163,19 +156821,18 @@ "TextFieldSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TextFieldSlots", - "description": "The text field component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "accessory", "value": "HTMLElement", - "description": "Additional interactive content displayed within the text field.\n\nAccepts button and clickable components with text content only. Other component types or complex layouts are not supported.", + "description": "An accessory element to display at the end of the text field, such as a button, icon, or other interactive component. This appears inside the field's visual boundary, typically for actions like clearing the field or showing additional options.", "isOptional": true } ], - "value": "export interface TextFieldSlots {\n /**\n * Additional interactive content displayed within the text field.\n *\n * Accepts button and clickable components with text content only. Other component types or complex layouts are not supported.\n */\n accessory?: HTMLElement;\n}" + "value": "export interface TextFieldSlots {\n /**\n * An accessory element to display at the end of the text field, such as a button, icon, or other interactive component. This appears inside the field's visual boundary, typically for actions like clearing the field or showing additional options.\n */\n accessory?: HTMLElement;\n}" } } }, @@ -141187,15 +156844,14 @@ "TextFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "TextFieldEvents", - "description": "The text field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -141203,7 +156859,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -141211,7 +156867,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -141219,27 +156875,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the text field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface TextFieldEvents {\n /**\n * A callback fired when the text field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the text field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the text field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the text field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface TextFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -141390,9 +157044,25 @@ "Thumbnail": { "filePath": "src/surfaces/admin/components.ts", "name": "Thumbnail", - "description": "Configure the following properties on the thumbnail component.", - "isPublicDocs": true, + "description": "A thumbnail displays a small preview image with configurable sizing.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -141407,8 +157077,8 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``", + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`", "isOptional": true }, { @@ -141425,7 +157095,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -141452,7 +157122,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -141470,7 +157140,7 @@ "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the product thumbnail image.\n\n- `small-200`: Smallest thumbnail size, ideal for compact product lists or tables.\n- `small-100`: Very small thumbnail, suitable for dense layouts.\n- `small`: Small thumbnail for space-constrained contexts.\n- `base`: Default size that balances visibility and space efficiency.\n- `large`: Larger thumbnail for featured products or detailed views.\n- `large-100`: Extra large thumbnail for prominent product display.", + "description": "The size of the thumbnail.", "defaultValue": "'base'", "isOptional": true }, @@ -141479,17 +157149,24 @@ "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered.", + "description": "The URL of the image to display in the thumbnail.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", "isOptional": true } ], - "value": "declare class Thumbnail extends PreactCustomElement implements ThumbnailProps {\n accessor src: ThumbnailProps['src'];\n accessor alt: ThumbnailProps['alt'];\n accessor size: ThumbnailProps['size'];\n constructor();\n}" + "value": "declare class Thumbnail extends PolarisCustomElement implements ThumbnailProps {\n /**\n * The URL of the image to display in the thumbnail.\n */\n src: ThumbnailProps['src'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ThumbnailProps['alt'];\n /**\n * The size of the thumbnail.\n */\n size: ThumbnailProps['size'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -141512,7 +157189,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -141520,7 +157197,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -141528,7 +157205,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -141536,11 +157213,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -141552,15 +157229,14 @@ "ThumbnailEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ThumbnailEvents", - "description": "The thumbnail component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "error", "value": "OnErrorEventHandler", - "description": "A callback fired when the thumbnail image fails to load.\n\nLearn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).", + "description": "A callback that's fired when the image fails to load.", "isOptional": true }, { @@ -141568,27 +157244,25 @@ "syntaxKind": "PropertySignature", "name": "load", "value": "CallbackEventListener | null", - "description": "A callback fired when the thumbnail image successfully loads.\n\nLearn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).", + "description": "A callback that's fired when the image has loaded successfully.", "isOptional": true } ], - "value": "export interface ThumbnailEvents {\n /**\n * A callback fired when the thumbnail image successfully loads.\n *\n * Learn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback fired when the thumbnail image fails to load.\n *\n * Learn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).\n */\n error: OnErrorEventHandler = null;\n}" + "value": "export interface ThumbnailEvents {\n /**\n * A callback that's fired when the image has loaded successfully.\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback that's fired when the image fails to load.\n */\n error: OnErrorEventHandler = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -141705,19 +157379,18 @@ "TooltipSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TooltipSlots", - "description": "The tooltip component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The informational text or elements displayed within the tooltip overlay, providing helpful context or explanations when users interact with the associated element.\n\nOnly accepts text, paragraph components, and raw `textContent`.", + "description": "The content to display inside the tooltip, which should include text or paragraph components, or raw text content.", "isOptional": true } ], - "value": "export interface TooltipSlots {\n /**\n * The informational text or elements displayed within the tooltip overlay, providing helpful context or explanations when users interact with the associated element.\n *\n * Only accepts text, paragraph components, and raw `textContent`.\n */\n children?: HTMLElement;\n}" + "value": "export interface TooltipSlots {\n /**\n * The content to display inside the tooltip, which should include text or paragraph components, or raw text content.\n */\n children?: HTMLElement;\n}" } } } @@ -141833,18 +157506,34 @@ "URLField": { "filePath": "src/surfaces/admin/components.ts", "name": "URLField", - "description": "Configure the following properties on the URL field component.", - "isPublicDocs": true, + "description": "The URL field custom element class that renders a URL input field in the Shopify admin interface. This component allows merchants to enter web addresses with automatic URL validation and appropriate mobile keyboard layouts.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@11381", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -141868,8 +157557,8 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | `section-${string} url` | `section-${string} photo` | `section-${string} impp` | `section-${string} home impp` | `section-${string} mobile impp` | `section-${string} fax impp` | `section-${string} pager impp` | \"shipping url\" | \"shipping photo\" | \"shipping impp\" | \"shipping home impp\" | \"shipping mobile impp\" | \"shipping fax impp\" | \"shipping pager impp\" | \"billing url\" | \"billing photo\" | \"billing impp\" | \"billing home impp\" | \"billing mobile impp\" | \"billing fax impp\" | \"billing pager impp\" | `section-${string} shipping url` | `section-${string} shipping photo` | `section-${string} shipping impp` | `section-${string} shipping home impp` | `section-${string} shipping mobile impp` | `section-${string} shipping fax impp` | `section-${string} shipping pager impp` | `section-${string} billing url` | `section-${string} billing photo` | `section-${string} billing impp` | `section-${string} billing home impp` | `section-${string} billing mobile impp` | `section-${string} billing fax impp` | `section-${string} billing pager impp` | URLAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else", + "description": "A hint about the intended content of the field for browser autofill.", + "defaultValue": "'url'", "isOptional": true }, { @@ -141877,7 +157566,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -141895,15 +157584,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -141911,7 +157600,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -141928,8 +157617,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -141964,7 +157653,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -141972,7 +157661,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -141980,8 +157669,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -141989,7 +157678,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -141998,7 +157687,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the URL.", "defaultValue": "Infinity", "isOptional": true }, @@ -142007,7 +157696,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the URL.", "defaultValue": "0", "isOptional": true }, @@ -142016,7 +157705,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -142024,7 +157713,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -142032,7 +157721,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -142041,7 +157730,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -142050,7 +157739,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -142063,30 +157752,36 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing.", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true } ], - "value": "declare class URLField\n extends PreactFieldElement\n implements URLFieldProps\n{\n accessor autocomplete: URLFieldProps['autocomplete'];\n accessor maxLength: URLFieldProps['maxLength'];\n accessor minLength: URLFieldProps['minLength'];\n /**\n * The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class URLField extends URLFieldBase implements URLFieldProps {\n constructor();\n}" }, "URLAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "URLAutocompleteField", "value": "'url' | 'photo' | 'impp' | 'home impp' | 'mobile impp' | 'fax impp' | 'pager impp'", - "description": "Represents autocomplete values that are valid for URL input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for URL inputs.\n\nAvailable values:\n- `url` - General URL or web address\n- `photo` - URL to a photo or image\n- `impp` - Instant messaging protocol URL\n- `home impp` - Home instant messaging protocol URL\n- `mobile impp` - Mobile instant messaging protocol URL\n- `fax impp` - Fax instant messaging protocol URL\n- `pager impp` - Pager instant messaging protocol URL", - "isPublicDocs": true + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -142109,7 +157804,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -142117,7 +157812,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -142125,7 +157820,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -142133,11 +157828,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -142149,15 +157844,14 @@ "URLFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "URLFieldEvents", - "description": "The URL field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the URL field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -142165,7 +157859,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the URL field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -142173,7 +157867,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the URL field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -142181,27 +157875,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the URL field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface URLFieldEvents {\n /**\n * A callback fired when the URL field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the URL field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the URL field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the URL field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface URLFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -142317,19 +158009,18 @@ "UnorderedListSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "UnorderedListSlots", - "description": "The unordered list component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The list entries displayed within the unordered list, where each item is marked with a bullet point. Only accepts list item components as children. Each list item represents a single bulleted entry in the list.", + "description": "The items in the unordered list. Only list item components are accepted.", "isOptional": true } ], - "value": "export interface UnorderedListSlots {\n /**\n * The list entries displayed within the unordered list, where each item is marked with a bullet point. Only accepts list item components as children. Each list item represents a single bulleted entry in the list.\n */\n children?: HTMLElement;\n}" + "value": "export interface UnorderedListSlots {\n /**\n * The items in the unordered list. Only list item components are accepted.\n */\n children?: HTMLElement;\n}" } } }, @@ -142341,9 +158032,25 @@ "ListItem": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItem", - "description": "The list item component represents a single entry within an ordered list or unordered list. Use list item to structure individual points, steps, or items within a list, with each item automatically receiving appropriate list markers (bullets or numbers) from its parent list.\n\nList item must be used as a direct child of ordered list or unordered list components. Each list item can contain text, inline formatting, or other components to create rich list content.", - "isPublicDocs": true, + "description": "A component that represents a single item within an ordered list or unordered list.\n\nUse list item as a child of ordered list or unordered list to create properly structured and accessible list content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -142367,7 +158074,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -142394,7 +158101,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -142406,15 +158113,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class ListItem extends PreactCustomElement implements ListItemProps {\n constructor();\n}" + "value": "declare class ListItem extends PolarisCustomElement implements ListItemProps {\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -142437,7 +158151,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -142445,7 +158159,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -142453,7 +158167,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -142461,11 +158175,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -142477,19 +158191,18 @@ "ListItemSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItemSlots", - "description": "The list item component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The content displayed within the list item, which represents a single entry in an ordered or unordered list.", + "description": "The content to display inside the list item.", "isOptional": true } ], - "value": "export interface ListItemSlots {\n /**\n * The content displayed within the list item, which represents a single entry in an ordered or unordered list.\n */\n children?: HTMLElement;\n}" + "value": "export interface ListItemSlots {\n /**\n * The content to display inside the list item.\n */\n children?: HTMLElement;\n}" } } } diff --git a/packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04-rc/generated_docs_data_v2.json b/packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04/generated_docs_data_v2.json similarity index 51% rename from packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04-rc/generated_docs_data_v2.json rename to packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04/generated_docs_data_v2.json index 5979f6e1f5..36fc49fec8 100644 --- a/packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04-rc/generated_docs_data_v2.json +++ b/packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04/generated_docs_data_v2.json @@ -179,6 +179,13 @@ "value": "RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >", "description": "A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options." }, + { + "filePath": "src/surfaces/admin/extension-targets.ts", + "syntaxKind": "PropertySignature", + "name": "admin.app.intent.render", + "value": "RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >", + "description": "Renders an admin extension for handling app intents." + }, { "filePath": "src/surfaces/admin/extension-targets.ts", "syntaxKind": "PropertySignature", @@ -706,7 +713,7 @@ "description": "A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules." } ], - "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n}" + "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n\n /**\n * Renders an admin extension for handling app intents.\n */\n 'admin.app.intent.render': RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >;\n}" } }, "RenderExtension": { @@ -917,9 +924,17 @@ "value": "string | URL", "description": "The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.", + "isOptional": true } ], - "value": "export interface Intents {\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" + "value": "export interface Intents {\n /**\n * Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.\n */\n response?: IntentResponseApi;\n\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" } }, "IntentInvokeApi": { @@ -932,6 +947,71 @@ "value": "export interface IntentInvokeApi {\n (query: IntentQuery): Promise;\n (intentURL: string, options?: IntentQueryOptions): Promise;\n}" } }, + "IntentResponseApi": { + "src/surfaces/admin/api/intents/intents.ts": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "IntentResponseApi", + "description": "The `IntentResponseApi` object provides methods for resolving the current intent from within an invoked extension. This API is only present when your extension is running inside an intent workflow.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "closed", + "value": "() => Promise", + "description": "Resolves the current intent as closed without completing the workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "error", + "value": "(message: string, issues?: Issue[]) => Promise", + "description": "Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "ok", + "value": "(data?: { [key: string]: unknown; }) => Promise", + "description": "Resolves the current intent successfully. Pass output data when your intent defines a response schema." + } + ], + "value": "export interface IntentResponseApi {\n /**\n * Resolves the current intent successfully. Pass output data when your intent defines a response schema.\n */\n ok(data?: SuccessIntentResponse['data']): Promise;\n\n /**\n * Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available.\n */\n error(message: string, issues?: Issue[]): Promise;\n\n /**\n * Resolves the current intent as closed without completing the workflow.\n */\n closed(): Promise;\n}" + } + }, + "Issue": { + "src/surfaces/admin/api/intents/intents.ts": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "Issue", + "description": "A structured issue describing a validation or workflow error.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "code", + "value": "string", + "description": "A machine-readable error code for this issue. Use this for programmatic error handling or logging.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "message", + "value": "string", + "description": "A description of what's wrong with this field. Display this to help merchants understand how to fix the error.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "path", + "value": "string[]", + "description": "The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure.", + "isOptional": true + } + ], + "value": "export interface Issue {\n /** The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure. */\n path?: string[];\n /** A description of what's wrong with this field. Display this to help merchants understand how to fix the error. */\n message?: string;\n /** A machine-readable error code for this issue. Use this for programmatic error handling or logging. */\n code?: string;\n}" + } + }, "PickerApi": { "src/surfaces/admin/api/picker/picker.ts": { "filePath": "src/surfaces/admin/api/picker/picker.ts", @@ -1397,29 +1477,28 @@ "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Avatar", - "description": "Configure the following properties on the avatar component.", - "isPublicDocs": true, + "description": "An avatar displays a user or entity image with fallback initials when the image isn't available.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "initials", "value": "string", - "description": "The initials to display in the avatar when no image is provided or fails to load. Typically one or two characters representing a person's first and last name initials, such as \"JD\" for John Doe." + "description": "The initials to display when no image is provided or if the image fails to load." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The URL or path to the avatar image. When provided, the image takes priority over `initials`. If the image fails to load or loads slowly, `initials` will be rendered as a fallback." + "description": "The URL of the avatar image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"base\" | \"large\" | \"large-200\"", - "description": "The size of the avatar image.\n\n- `small-200`: Extra small avatar, suitable for compact displays or lists with many items.\n- `small`: Small avatar, good for secondary contexts or tight layouts.\n- `base`: Default size that works well in most contexts.\n- `large`: Large avatar for emphasis or when the avatar is a focal point.\n- `large-200`: Extra large avatar for prominent display.", + "description": "The size of the avatar.", "defaultValue": "'base'" }, { @@ -1427,7 +1506,14 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the avatar for accessibility.\n\nProvides a text description of the avatar for users with assistive technology and serves as a fallback when the avatar fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an avatar, it reads this description aloud. When an avatar fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt)." + "description": "Alternative text that describes the avatar for screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -1474,7 +1560,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -1482,11 +1568,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Avatar extends PreactCustomElement implements AvatarProps {\n accessor initials: AvatarProps['initials'];\n accessor src: AvatarProps['src'];\n accessor size: AvatarProps['size'];\n accessor alt: AvatarProps['alt'];\n constructor();\n}" + "value": "declare class Avatar extends PolarisCustomElement implements AvatarProps {\n /**\n * The initials to display when no image is provided or if the image fails to load.\n */\n initials: AvatarProps['initials'];\n /**\n * The URL of the avatar image to display.\n */\n src: AvatarProps['src'];\n /**\n * The size of the avatar.\n */\n size: AvatarProps['size'];\n /**\n * Alternative text that describes the avatar for screen readers.\n */\n alt: AvatarProps['alt'];\n constructor();\n}" } }, "ClickOptions": { @@ -1494,7 +1595,6 @@ "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -1519,70 +1619,77 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred." + "description": "" } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } }, "Badge": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Badge", - "description": "Configure the following properties on the badge component.", - "isPublicDocs": true, + "description": "The badge custom element class that renders status indicators in the Shopify admin interface. This component displays compact visual indicators with customizable tones, sizes, and optional icons to communicate status information to merchants.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"strong\"", - "description": "Controls the visual weight and emphasis of the badge.\n\n- `base`: Standard weight with moderate emphasis, suitable for most use cases.\n- `strong`: Increased visual weight for higher emphasis and prominence.", - "defaultValue": "'base'" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the badge to provide additional visual context or reinforce the badge's meaning. Accepts any icon name from the icon library or a custom string identifier." + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"strong\"", + "description": "The visual weight of the badge. Available options: `'base'` for standard weight or `'strong'` for increased emphasis.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the badge.\n\n- `base`: Default size suitable for most badge use cases.\n- `large`: Larger badge for increased visibility and prominence.\n- `large-100`: Extra large badge for maximum visibility in emphasized contexts.", + "description": "The size of the badge. Available options: `'base'` for standard size, `'large'` for larger size, or `'large-100'` for extra large size.", "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", - "defaultValue": "'auto'" + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -1629,7 +1736,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -1637,19 +1744,42 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Badge extends PreactCustomElement implements BadgeProps {\n accessor color: BadgeProps['color'];\n accessor icon: BadgeProps['icon'];\n accessor size: BadgeProps['size'];\n accessor tone: BadgeProps['tone'];\n constructor();\n}" + "value": "declare class Badge extends BadgeBase implements BadgeProps {\n /**\n * The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: BadgeProps['icon'];\n /**\n * The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.\n */\n tone: BadgeProps['tone'];\n constructor();\n}" + } + }, + "IconType": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" } }, "Banner": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Banner", - "description": "Configure the following properties on the banner component.", - "isPublicDocs": true, + "description": "A custom element for displaying important messages and notifications.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -1664,7 +1794,7 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.", + "description": "The color tone of the banner based on its semantic meaning.", "defaultValue": "'auto'" }, { @@ -1672,7 +1802,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Controls whether the banner is visible or hidden.\n\nWhen using a controlled component pattern and the banner is `dismissible`, update this property to `true` when the `dismiss` event fires.\n\nYou can hide the banner programmatically by setting this to `true` even if it's not `dismissible`.", + "description": "Whether the banner is hidden from view.", "defaultValue": "false" }, { @@ -1680,9 +1810,16 @@ "syntaxKind": "PropertyDeclaration", "name": "dismissible", "value": "boolean", - "description": "Whether the banner displays a close button that allows users to dismiss it.\n\nWhen the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, any animation completes, and the `afterhide` event fires.", + "description": "Whether the banner can be dismissed by the user.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -1728,7 +1865,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -1736,26 +1873,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Banner extends PreactCustomElement implements BannerProps {\n accessor heading: BannerProps['heading'];\n accessor tone: BannerProps['tone'];\n accessor hidden: BannerProps['hidden'];\n accessor dismissible: BannerProps['dismissible'];\n constructor();\n}" + "value": "declare class Banner extends PolarisCustomElement implements BannerProps {\n /**\n * The heading text displayed at the top of the banner.\n */\n heading: BannerProps['heading'];\n /**\n * The color tone of the banner based on its semantic meaning.\n */\n tone: BannerProps['tone'];\n /**\n * Whether the banner is hidden from view.\n */\n hidden: BannerProps['hidden'];\n /**\n * Whether the banner can be dismissed by the user.\n */\n dismissible: BannerProps['dismissible'];\n constructor();\n}" } }, "Box": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Box", - "description": "Configure the following properties on the box component.", - "isPublicDocs": true, + "description": "A box is a container component that provides control over layout, spacing, and styling.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -1763,7 +1914,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -1771,7 +1922,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -1779,7 +1930,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -1787,7 +1938,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -1795,7 +1946,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -1803,7 +1954,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -1811,7 +1962,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -1819,7 +1970,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -1827,7 +1978,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -1835,7 +1986,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1843,7 +1994,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1851,7 +2002,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1859,7 +2010,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1867,7 +2018,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1875,7 +2026,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1883,7 +2034,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -1903,7 +2054,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -1911,7 +2062,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -1919,7 +2070,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -1927,7 +2078,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -1935,14 +2086,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -1950,9 +2101,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -1998,7 +2156,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2006,8 +2164,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Box extends BoxElement implements BoxProps {\n constructor();\n}" @@ -2018,9 +2191,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" } }, "BackgroundColorKeyword": { @@ -2029,8 +2201,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" } }, "ColorKeyword": { @@ -2039,8 +2210,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" } }, "SizeUnitsOrAuto": { @@ -2049,8 +2219,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" } }, "SizeUnits": { @@ -2059,8 +2228,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" } }, "SizeUnitsOrNone": { @@ -2069,8 +2237,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" } }, "MaybeResponsive": { @@ -2079,8 +2246,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" } }, "MaybeAllValuesShorthandProperty": { @@ -2089,8 +2255,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" } }, "PaddingKeyword": { @@ -2099,8 +2264,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" } }, "SizeKeyword": { @@ -2109,8 +2273,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" } }, "MaybeTwoValuesShorthandProperty": { @@ -2119,8 +2282,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" } }, "BorderShorthand": { @@ -2129,8 +2291,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." } }, "BorderSizeKeyword": { @@ -2139,8 +2300,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" } }, "BorderStyleKeyword": { @@ -2149,8 +2309,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" } }, "BoxBorderStyles": { @@ -2159,7 +2318,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true } }, @@ -2169,7 +2328,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true } }, @@ -2177,54 +2336,54 @@ "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Button", - "description": "Configure the following properties on the button component.", - "isPublicDocs": true, + "description": "The button custom element class that renders interactive buttons in the Shopify admin interface. This component triggers actions or navigation when clicked, with customizable visual styles, states, and optional icons.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", - "defaultValue": "false" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier." + "name": "variant", + "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", + "description": "The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.", + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "loading", - "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", - "defaultValue": "false" + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "variant", - "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "defaultValue": "'auto'" + "name": "disabled", + "value": "boolean", + "description": "Whether the button is disabled, preventing any interaction. When `true`, the button appears visually disabled and doesn't respond to user clicks.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" + "name": "loading", + "value": "boolean", + "description": "Whether the button is in a loading state. When `true`, displays a loading indicator and prevents interaction to show that an action is in progress.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to open the linked document when the button acts as a link. Available options: `''`, `'_blank'`, `'_self'`, `'_parent'`, or `'_top'`.", "defaultValue": "'auto'" }, { @@ -2232,21 +2391,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "A URL that the button should navigate to when clicked. When provided, the button behaves as a link." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Prompts the user to save the linked URL as a file with the specified filename. Only works when `href` is provided." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The button's behavior in forms. Available options: `'button'`, `'submit'`, or `'reset'`.", "defaultValue": "'button'" }, { @@ -2254,7 +2413,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the button's purpose for screen readers. This is essential for accessibility when the button doesn't have visible text." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "inlineSize", + "value": "\"auto\" | \"fill\" | \"fit-content\"", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -2301,7 +2475,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2309,15 +2483,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -2325,17 +2514,17 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Button extends Button_base implements ButtonProps {\n accessor disabled: ButtonProps['disabled'];\n accessor icon: ButtonProps['icon'];\n accessor loading: ButtonProps['loading'];\n accessor variant: ButtonProps['variant'];\n accessor tone: ButtonProps['tone'];\n accessor target: ButtonProps['target'];\n accessor href: ButtonProps['href'];\n accessor download: ButtonProps['download'];\n accessor type: ButtonProps['type'];\n accessor accessibilityLabel: ButtonProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Button\n extends ButtonBase\n implements ButtonProps\n{\n /**\n * The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: ButtonProps['icon'];\n /**\n * The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.\n */\n variant: ButtonProps['variant'];\n /**\n * The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.\n */\n tone: ButtonProps['tone'];\n constructor();\n}" } }, "AnyString": { @@ -2344,23 +2533,21 @@ "syntaxKind": "TypeAliasDeclaration", "name": "AnyString", "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true + "description": "Prevents widening string literal types in a union to `string`." } }, "ButtonGroup": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "ButtonGroup", - "description": "Configure the following properties on the button group component.", - "isPublicDocs": true, + "description": "A button group that arranges multiple buttons together with consistent spacing and semantic grouping for related actions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "\"base\" | \"none\"", - "description": "The spacing between buttons in the group.\n\n- `base`: Standard spacing that provides clear visual separation between buttons.\n- `none`: No spacing, creating a connected button group.", + "description": "The amount of spacing between buttons in the group, affecting the visual separation of actions.", "defaultValue": "'base'" }, { @@ -2368,7 +2555,21 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, describing the purpose of this group of buttons." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -2394,14 +2595,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -2415,7 +2608,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2423,41 +2616,70 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ButtonGroup\n extends PreactCustomElement\n implements ButtonGroupProps\n{\n accessor gap: ButtonGroupProps['gap'];\n accessor accessibilityLabel: ButtonGroupProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class ButtonGroup extends ButtonGroupBase implements ButtonGroupProps {\n constructor();\n}" } }, "Checkbox": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Checkbox", - "description": "Configure the following properties on the checkbox component.", - "isPublicDocs": true, + "description": "A checkbox that lets users select or deselect an option, with support for an indeterminate state.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "indeterminate", "value": "boolean", - "description": "Whether the checkbox displays in an indeterminate state (neither checked nor unchecked), typically used to indicate partial selection in hierarchical lists.\n\nThis visual state takes priority over the `checked` prop in appearance only. The form submission value is still determined by the `checked` prop.\n\nIf `indeterminate` has not been explicitly set and hasn't been modified by user interaction, it returns the value of `defaultIndeterminate`." + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultIndeterminate", "value": "boolean", - "description": "The initial indeterminate state for uncontrolled components. Use this when you want the checkbox to start in an indeterminate state but don't need to control it afterward.\n\nThis value applies until `indeterminate` is explicitly set or the user changes the checkbox state by clicking.", + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "labelAccessibilityVisibility", + "value": "\"visible\" | \"exclusive\"", + "description": "", + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -2472,7 +2694,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -2480,28 +2702,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -2524,7 +2746,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -2532,23 +2754,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@2229", + "name": "__@internals$4@7093", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -2594,7 +2823,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2602,26 +2831,49 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Checkbox extends PreactCheckboxElement implements CheckboxProps {\n get indeterminate(): CheckboxProps['indeterminate'];\n set indeterminate(indeterminate: CheckboxProps['indeterminate']);\n accessor defaultIndeterminate: CheckboxProps['defaultIndeterminate'];\n constructor();\n}" + "value": "declare class Checkbox extends CheckboxBase implements CheckboxProps {\n constructor();\n}" + } + }, + "CallbackEvent": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CallbackEvent", + "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } }, "Chip": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Chip", - "description": "Configure the following properties on the chip component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "Modify the color to be more or less intense.", "defaultValue": "'base'" }, { @@ -2629,7 +2881,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -2676,7 +2943,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2684,26 +2951,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Chip extends PreactCustomElement implements ChipProps {\n accessor color: ChipProps['color'];\n accessor accessibilityLabel: ChipProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Chip extends PolarisCustomElement implements ChipProps {\n color: ChipProps['color'];\n accessibilityLabel: ChipProps['accessibilityLabel'];\n removable: ChipProps['removable'];\n constructor(renderImpl?: Omit);\n}" } }, "Choice": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Choice", - "description": "The choice component creates individual selectable options within a choice list. Use choice to define each option that merchants can select, supporting both single selection (radio buttons) and multiple selection (checkboxes) modes.\n\nChoice components support labels, help text, and custom content through slots, providing flexible option presentation within choice lists.", - "isPublicDocs": true, + "description": "A single choice within a choice list that can be selected with a radio button or checkbox.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the choice is disabled and can't be selected.", "defaultValue": "false" }, { @@ -2711,7 +2992,7 @@ "syntaxKind": "GetAccessor", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the choice is currently selected.", "defaultValue": "false" }, { @@ -2719,21 +3000,21 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this choice is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, used when the visual label isn't descriptive enough." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the choice should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -2752,6 +3033,13 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -2781,7 +3069,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2789,26 +3077,56 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Choice extends PreactCustomElement implements ChoiceProps {\n accessor disabled: ChoiceProps['disabled'];\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n accessor value: ChoiceProps['value'];\n accessor accessibilityLabel: ChoiceProps['accessibilityLabel'];\n accessor defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Choice extends PolarisCustomElement implements ChoiceProps {\n /**\n * Whether the choice is disabled and can't be selected.\n */\n disabled: ChoiceProps['disabled'];\n /**\n * Whether the choice is currently selected.\n */\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n /**\n * The value that's submitted with the form when this choice is selected.\n */\n value: ChoiceProps['value'];\n /**\n * A label that's only visible to screen readers, used when the visual label isn't descriptive enough.\n */\n accessibilityLabel: ChoiceProps['accessibilityLabel'];\n /**\n * Whether the choice should be selected when it's first rendered.\n */\n defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" } }, "ChoiceList": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceList", - "description": "Configure the following properties on the choice list component.", - "isPublicDocs": true, + "description": "A list of choices that lets users select one or more options using radio buttons or checkboxes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "addEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", + "description": "Wraps change and input event listeners so they only fire when the event was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n\nThis prevents form events from elements inside secondary content (e.g. TextField, native ) from being mistakenly treated as ChoiceList value-change events, while still allowing those events to bubble normally through the DOM (preserving React's event delegation).", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "removeEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction. When `true`, the `disabled` property on any child choices is ignored.", + "description": "Whether all choices in the list are disabled and can't be selected.", "defaultValue": "false" }, { @@ -2816,43 +3134,43 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name that identifies this choice list when the form is submitted." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the choice list when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the choice list." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "multiple", "value": "boolean", - "description": "Whether multiple choices can be selected.", + "description": "Whether users can select more than one choice at a time.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the choice list is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -2860,7 +3178,7 @@ "syntaxKind": "GetAccessor", "name": "values", "value": "string[]", - "description": "An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected." + "description": "The values of the currently selected choices." }, { "filePath": "src/surfaces/admin/components.ts", @@ -2889,11 +3207,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$3@2282", + "name": "__@internals$3@7169", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -2923,7 +3248,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2931,40 +3256,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ChoiceList extends BaseClass$3 implements ChoiceListProps {\n accessor disabled: ChoiceListProps['disabled'];\n accessor name: ChoiceListProps['name'];\n accessor error: ChoiceListProps['error'];\n accessor details: ChoiceListProps['details'];\n accessor multiple: ChoiceListProps['multiple'];\n accessor label: ChoiceListProps['label'];\n accessor labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class ChoiceList extends BaseClass$1 implements ChoiceListProps {\n /**\n * Wraps change and input event listeners so they only fire when the event\n * was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n *\n * This prevents form events from elements inside secondary content (e.g.\n * TextField, native ) from being mistakenly treated as ChoiceList\n * value-change events, while still allowing those events to bubble normally\n * through the DOM (preserving React's event delegation).\n * @private\n */\n addEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n\n /** @private */\n removeEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: EventListenerOptions | boolean,\n ): void;\n\n /**\n * Whether all choices in the list are disabled and can't be selected.\n */\n disabled: ChoiceListProps['disabled'];\n /**\n * The name that identifies this choice list when the form is submitted.\n */\n name: ChoiceListProps['name'];\n /**\n * An error message that's displayed below the choice list when validation fails.\n */\n error: ChoiceListProps['error'];\n /**\n * Additional text to provide context or guidance for the choice list.\n */\n details: ChoiceListProps['details'];\n /**\n * Whether users can select more than one choice at a time.\n */\n multiple: ChoiceListProps['multiple'];\n /**\n * The text that describes what the choice list is for.\n */\n label: ChoiceListProps['label'];\n /**\n * Controls whether the label is visible to all users or only to screen readers.\n */\n labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n /**\n * The values of the currently selected choices.\n */\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" } }, "Clickable": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Clickable", - "description": "Configure the following properties on the clickable component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the component is disabled, preventing clicks and focus. When disabled, the `click` event won't fire and click events from child elements stop propagating immediately. Interactive child elements can still receive focus and be interacted with. This doesn't apply visual styling by default. You shouldapply disabled styling as needed." + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the component is in a loading state, which indicates to assistive technology that an action is in progress and prevents interaction." + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -2972,21 +3311,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "defaultValue": "'button'" }, { @@ -2994,7 +3333,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -3002,7 +3341,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -3010,7 +3349,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -3018,7 +3357,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -3026,7 +3365,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -3034,7 +3373,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -3042,7 +3381,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -3050,7 +3389,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -3058,7 +3397,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -3066,7 +3405,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -3074,7 +3413,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -3082,7 +3421,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -3090,7 +3429,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -3098,7 +3437,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -3106,7 +3445,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -3114,7 +3453,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -3122,7 +3461,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -3142,7 +3481,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -3150,7 +3489,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -3158,7 +3497,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -3166,7 +3505,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -3174,14 +3513,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -3189,9 +3528,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -3237,7 +3583,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -3245,15 +3591,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -3261,32 +3622,31 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n accessor disabled: ClickableProps['disabled'];\n accessor loading: ClickableProps['loading'];\n accessor target: ClickableProps['target'];\n accessor href: ClickableProps['href'];\n accessor download: ClickableProps['download'];\n accessor type: ClickableProps['type'];\n constructor();\n}" + "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n disabled: ClickableProps['disabled'];\n loading: ClickableProps['loading'];\n target: ClickableProps['target'];\n href: ClickableProps['href'];\n download: ClickableProps['download'];\n type: ClickableProps['type'];\n constructor();\n}" } }, "ClickableChip": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChip", - "description": "Configure the following properties on the clickable chip component.", - "isPublicDocs": true, + "description": "A custom element for displaying interactive chips that can be clicked or removed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "The color of the chip.", "defaultValue": "'base'" }, { @@ -3294,14 +3654,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the chip for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "removable", "value": "boolean", - "description": "Whether the chip displays a remove button for dismissal. When clicked, the `remove` callback fires.", + "description": "Whether the chip can be removed by the user.", "defaultValue": "false" }, { @@ -3309,7 +3669,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Whether the chip is hidden from view. When using controlled component pattern with `removable` chips, update this property when the `remove` event fires. For non-removable chips, manually toggle this property to show or hide the chip.", + "description": "Whether the chip is hidden from view.", "defaultValue": "false" }, { @@ -3317,7 +3677,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the chip is disabled, preventing any user interaction.", + "description": "Whether the chip is disabled and can't be clicked.", "defaultValue": "false" }, { @@ -3325,7 +3685,14 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to navigate to when the chip is clicked." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -3372,7 +3739,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -3380,15 +3747,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -3396,32 +3778,31 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class ClickableChip\n extends ClickableChip_base\n implements ClickableChipProps\n{\n accessor color: ClickableChipProps['color'];\n accessor accessibilityLabel: ClickableChipProps['accessibilityLabel'];\n accessor removable: ClickableChipProps['removable'];\n accessor hidden: ClickableChipProps['hidden'];\n accessor disabled: ClickableChipProps['disabled'];\n accessor href: ClickableChipProps['href'];\n constructor();\n}" + "value": "declare class ClickableChip\n extends ClickableChipBase\n implements ClickableChipProps\n{\n /**\n * The color of the chip.\n */\n color: ClickableChipProps['color'];\n constructor();\n}" } }, "ColorField": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorField", - "description": "Configure the following properties on the color field component.", - "isPublicDocs": true, + "description": "The color field custom element class that renders a color input field with integrated visual picker in the Shopify admin interface. This component allows merchants to select colors by typing hex values or using an interactive color picker, with optional support for transparency (alpha channel).", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -3429,7 +3810,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", @@ -3452,7 +3833,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\"", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -3460,35 +3841,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -3496,14 +3877,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -3511,7 +3892,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -3535,7 +3916,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -3551,7 +3932,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -3559,23 +3940,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@2229", + "name": "__@internals$4@7093", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -3613,7 +4001,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -3621,26 +4009,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ColorField\n extends PreactFieldElement\n implements ColorFieldProps\n{\n accessor alpha: ColorFieldProps['alpha'];\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n setInternalValue(value: string, normalize: boolean): void;\n}" + "value": "declare class ColorField extends ColorFieldBase implements ColorFieldProps {\n constructor();\n}" } }, "ColorPicker": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorPicker", - "description": "Configure the following properties on the color picker component.", - "isPublicDocs": true, + "description": "A visual color picker component that allows users to select colors from a color spectrum interface.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -3648,156 +4050,140 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial color value when the field first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts interacting, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", "name": "formResetCallback", "value": "() => void", - "description": "A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@internals$2@2383", - "value": "ElementInternals", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", "description": "", "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true } ], - "value": "declare class ColorPicker extends BaseClass$2 implements ColorPickerProps {\n accessor alpha: boolean;\n accessor name: string;\n accessor defaultValue: string;\n get value(): string;\n set value(value: string);\n /**\n * A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`.\n */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class ColorPicker extends BaseClass implements ColorPickerProps {\n /**\n * Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.\n *\n * @default false\n */\n alpha: boolean;\n /**\n * The name of the picker, used when submitting form data.\n */\n name: string;\n /**\n * The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n defaultValue: string;\n /**\n * The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n}" } }, "DateField": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "DateField", - "description": "Configure the following properties on the date field component.", - "isPublicDocs": true, + "description": "The date field custom element class that renders a date input field with integrated calendar picker in the Shopify admin interface. This component allows merchants to select dates by typing or using a visual calendar, with support for date range restrictions and day-of-week constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "disallowDays", - "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "disallowDays", + "value": "string", + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar picker, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar picker first opens, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "DateAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -3805,36 +4191,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "defaultValue": "\"\"" + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -3842,14 +4227,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -3857,7 +4242,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -3881,7 +4266,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -3905,7 +4290,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -3913,31 +4298,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected date in `YYYY-MM-DD` format. An empty string means no date is selected.", - "defaultValue": "\"\"" + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@2229", + "name": "__@internals$4@7093", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -3975,7 +4366,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -3983,11 +4374,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DateField\n extends PreactFieldElement\n implements DateFieldProps\n{\n accessor allow: DateFieldProps['allow'];\n accessor disallow: DateFieldProps['disallow'];\n accessor allowDays: DateFieldProps['allowDays'];\n accessor disallowDays: DateFieldProps['disallowDays'];\n set view(view: string);\n get view(): string;\n accessor defaultView: DateFieldProps['defaultView'];\n constructor();\n}" + "value": "declare class DateField extends DateFieldBase implements DateFieldProps {\n constructor();\n}" } }, "DateAutocompleteField": { @@ -3996,69 +4402,115 @@ "syntaxKind": "TypeAliasDeclaration", "name": "DateAutocompleteField", "value": "'bday-day' | 'bday-month' | 'bday-year' | 'bday' | 'cc-expiry-month' | 'cc-expiry-year' | 'cc-expiry'", - "description": "Represents autocomplete values that are valid for date input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for date-based inputs.\n\nAvailable values:\n- `bday` - Complete birthday date\n- `bday-day` - Day component of a birthday (1-31)\n- `bday-month` - Month component of a birthday (1-12)\n- `bday-year` - Year component of a birthday (1990)\n- `cc-expiry` - Complete credit card expiration date\n- `cc-expiry-month` - Month component of a credit card expiration date (1-12)\n- `cc-expiry-year` - Year component of a credit card expiration date (2025)", - "isPublicDocs": true + "description": "" } }, "DatePicker": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "DatePicker", - "description": "Configure the following properties on the date picker component.", - "isPublicDocs": true, + "description": "The date picker custom element class that renders a standalone calendar interface in the Shopify admin. This component allows merchants to select single dates or date ranges using an interactive calendar with month/year navigation, date constraints, and day-of-week restrictions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar first renders, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"single\" | \"range\"", - "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "description": "The type of date selection allowed. Available values: `single`, `range`.", "defaultValue": "\"single\"" }, { @@ -4066,7 +4518,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initially selected date(s) when the component first renders. An empty string means no date is initially selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The initial selected date or date range when the picker first renders, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -4074,14 +4526,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "value", "value": "string", - "description": "The currently selected date(s). An empty string means no date is selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The currently selected date or date range, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -4095,19 +4547,26 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@dirtyStateSymbol@2427", - "value": "boolean", + "name": "__@internals$1@7331", + "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$1@2426", - "value": "ElementInternals", + "name": "__@dirtyStateSymbol@7332", + "value": "boolean", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -4153,7 +4612,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -4161,19 +4620,33 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DatePicker extends BaseClass$1 implements DatePickerProps {\n accessor defaultView: string;\n set view(view: string);\n get view(): string;\n accessor allow: DatePickerProps['allow'];\n accessor disallow: DatePickerProps['disallow'];\n accessor allowDays: DatePickerProps['allowDays'];\n accessor disallowDays: DatePickerProps['disallowDays'];\n accessor type: DatePickerProps['type'];\n accessor defaultValue: DatePickerProps['defaultValue'];\n accessor name: DatePickerProps['name'];\n set value(value: string);\n get value(): string;\n /** @private */\n [dirtyStateSymbol]: boolean;\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DatePicker\n extends DatePickerBase\n implements DatePickerProps\n{\n constructor();\n}" } }, "DropZone": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "DropZone", - "description": "Configure the following properties on the drop zone component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -4195,29 +4668,29 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -4233,14 +4706,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -4270,7 +4743,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@setFiles@2462", + "name": "__@setFiles@7368", "value": "(files: File[]) => void", "description": "", "isPrivate": true @@ -4278,7 +4751,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@getFileInput@2464", + "name": "__@getFileInput@7370", "value": "() => HTMLInputElement", "description": "", "isPrivate": true @@ -4286,11 +4759,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals@2463", + "name": "__@internals@7369", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -4336,7 +4816,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -4344,19 +4824,33 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DropZone extends BaseClass implements DropZoneProps {\n accessor accept: DropZoneProps['accept'];\n accessor accessibilityLabel: DropZoneProps['accessibilityLabel'];\n accessor disabled: DropZoneProps['disabled'];\n accessor error: DropZoneProps['error'];\n accessor label: DropZoneProps['label'];\n accessor labelAccessibilityVisibility: DropZoneProps['labelAccessibilityVisibility'];\n accessor multiple: DropZoneProps['multiple'];\n accessor name: DropZoneProps['name'];\n accessor required: DropZoneProps['required'];\n get value(): string;\n /** This sets the input value for a file type, which cannot be set programatically, so it can only be reset. */\n set value(value: '' | null);\n get files(): File[];\n set files(files: File[]);\n /** @private */\n [setFiles](files: File[]): void;\n /** @private */\n [getFileInput](): ReplaceType<\n Element | null | undefined,\n Element,\n HTMLInputElement\n >;\n\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DropZone extends DropZoneBase implements DropZoneProps {\n constructor();\n}" } }, "Divider": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Divider", - "description": "Configure the following properties on the divider component.", - "isPublicDocs": true, + "description": "A divider is a visual separator that creates a line between different sections of content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -4374,6 +4868,13 @@ "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -4419,7 +4920,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -4427,34 +4928,48 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Divider extends PreactCustomElement implements DividerProps {\n accessor direction: DividerProps['direction'];\n accessor color: DividerProps['color'];\n constructor();\n}" + "value": "declare class Divider extends PolarisCustomElement implements DividerProps {\n /**\n * The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n *\n * - `inline`: Horizontal divider for separating vertically stacked content\n * - `block`: Vertical divider for separating horizontally arranged content\n *\n * @default 'inline'\n */\n direction: DividerProps['direction'];\n /**\n * The visual prominence of the divider line.\n *\n * - `base`: Standard divider for most separations (default)\n * - `strong`: More prominent divider for major section breaks\n *\n * @default 'base'\n */\n color: DividerProps['color'];\n constructor();\n}" } }, "EmailField": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "EmailField", - "description": "Configure the following properties on the email field component.", - "isPublicDocs": true, + "description": "The email field custom element class that renders an email input field in the Shopify admin interface. This component allows merchants to enter email addresses with automatic validation and optimized mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | EmailAutocompleteField | `section-${string} email` | `section-${string} home email` | `section-${string} mobile email` | `section-${string} fax email` | `section-${string} pager email` | \"shipping email\" | \"shipping home email\" | \"shipping mobile email\" | \"shipping fax email\" | \"shipping pager email\" | \"billing email\" | \"billing home email\" | \"billing mobile email\" | \"billing fax email\" | \"billing pager email\" | `section-${string} shipping email` | `section-${string} shipping home email` | `section-${string} shipping mobile email` | `section-${string} shipping fax email` | `section-${string} shipping pager email` | `section-${string} billing email` | `section-${string} billing home email` | `section-${string} billing mobile email` | `section-${string} billing fax email` | `section-${string} billing pager email`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint as to the intended content of the field for autocomplete purposes.", + "defaultValue": "'email'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -4462,50 +4977,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -4513,14 +5021,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -4528,7 +5036,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -4552,7 +5060,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -4576,7 +5084,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -4584,23 +5092,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@2229", + "name": "__@internals$4@7093", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -4638,7 +5160,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -4646,11 +5168,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class EmailField\n extends PreactFieldElement\n implements EmailFieldProps\n{\n accessor autocomplete: EmailFieldProps['autocomplete'];\n accessor maxLength: EmailFieldProps['maxLength'];\n accessor minLength: EmailFieldProps['minLength'];\n /**\n * The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class EmailField extends EmailFieldBase implements EmailFieldProps {\n constructor();\n}" } }, "EmailAutocompleteField": { @@ -4659,23 +5196,21 @@ "syntaxKind": "TypeAliasDeclaration", "name": "EmailAutocompleteField", "value": "'email' | 'home email' | 'mobile email' | 'fax email' | 'pager email'", - "description": "Represents autocomplete values that are valid for email input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for email inputs.\n\nAvailable values:\n- `email` - Primary email address\n- `home email` - Home email address\n- `mobile email` - Mobile device email address\n- `fax email` - Fax machine email address\n- `pager email` - Pager device email address", - "isPublicDocs": true + "description": "" } }, "Grid": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Grid", - "description": "Configure the following properties on the grid component.", - "isPublicDocs": true, + "description": "A grid is a layout component that arranges its children in rows and columns with precise control over sizing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridTemplateColumns", "value": "string", - "description": "The columns in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid columns.", "defaultValue": "'none'" }, { @@ -4683,7 +5218,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridTemplateRows", "value": "string", - "description": "The rows in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid rows.", "defaultValue": "'none'" }, { @@ -4691,7 +5226,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyItems", "value": "\"\" | JustifyItemsKeyword", - "description": "Aligns the grid items along the inline axis.", + "description": "The alignment of grid items along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -4699,7 +5234,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "\"\" | AlignItemsKeyword", - "description": "Aligns the grid items along the block axis.", + "description": "The alignment of grid items along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -4707,7 +5242,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeItems", "value": "AlignItemsKeyword | \"normal normal\" | \"normal stretch\" | \"normal baseline\" | \"normal first baseline\" | \"normal last baseline\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch baseline\" | \"stretch first baseline\" | \"stretch last baseline\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline baseline\" | \"baseline first baseline\" | \"baseline last baseline\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline baseline\" | \"first baseline first baseline\" | \"first baseline last baseline\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline baseline\" | \"last baseline first baseline\" | \"last baseline last baseline\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start baseline\" | \"start first baseline\" | \"start last baseline\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end baseline\" | \"end first baseline\" | \"end last baseline\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center baseline\" | \"center first baseline\" | \"center last baseline\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start baseline\" | \"unsafe start first baseline\" | \"unsafe start last baseline\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end baseline\" | \"unsafe end first baseline\" | \"unsafe end last baseline\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center baseline\" | \"unsafe center first baseline\" | \"unsafe center last baseline\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start baseline\" | \"safe start first baseline\" | \"safe start last baseline\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end baseline\" | \"safe end first baseline\" | \"safe end last baseline\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center baseline\" | \"safe center first baseline\" | \"safe center last baseline\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\"", - "description": "A shorthand property for `justify-items` and `align-items`.", + "description": "A shorthand for setting both `alignItems` and `justifyItems`.", "defaultValue": "'normal normal'" }, { @@ -4715,7 +5250,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "\"\" | JustifyContentKeyword", - "description": "Aligns the grid along the inline axis. This overrides the inline value of `placeContent`.", + "description": "The alignment of the grid along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -4723,7 +5258,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "\"\" | AlignContentKeyword", - "description": "Aligns the grid along the block axis. This overrides the block value of `placeContent`.", + "description": "The alignment of the grid along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -4731,7 +5266,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeContent", "value": "\"normal normal\" | \"normal stretch\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\" | AlignContentKeyword | \"normal space-between\" | \"normal space-around\" | \"normal space-evenly\" | \"baseline space-between\" | \"baseline space-around\" | \"baseline space-evenly\" | \"first baseline space-between\" | \"first baseline space-around\" | \"first baseline space-evenly\" | \"last baseline space-between\" | \"last baseline space-around\" | \"last baseline space-evenly\" | \"start space-between\" | \"start space-around\" | \"start space-evenly\" | \"end space-between\" | \"end space-around\" | \"end space-evenly\" | \"center space-between\" | \"center space-around\" | \"center space-evenly\" | \"unsafe start space-between\" | \"unsafe start space-around\" | \"unsafe start space-evenly\" | \"unsafe end space-between\" | \"unsafe end space-around\" | \"unsafe end space-evenly\" | \"unsafe center space-between\" | \"unsafe center space-around\" | \"unsafe center space-evenly\" | \"safe start space-between\" | \"safe start space-around\" | \"safe start space-evenly\" | \"safe end space-between\" | \"safe end space-around\" | \"safe end space-evenly\" | \"safe center space-between\" | \"safe center space-around\" | \"safe center space-evenly\" | \"stretch space-between\" | \"stretch space-around\" | \"stretch space-evenly\" | \"space-between normal\" | \"space-between start\" | \"space-between end\" | \"space-between center\" | \"space-between unsafe start\" | \"space-between unsafe end\" | \"space-between unsafe center\" | \"space-between safe start\" | \"space-between safe end\" | \"space-between safe center\" | \"space-between stretch\" | \"space-between space-between\" | \"space-between space-around\" | \"space-between space-evenly\" | \"space-around normal\" | \"space-around start\" | \"space-around end\" | \"space-around center\" | \"space-around unsafe start\" | \"space-around unsafe end\" | \"space-around unsafe center\" | \"space-around safe start\" | \"space-around safe end\" | \"space-around safe center\" | \"space-around stretch\" | \"space-around space-between\" | \"space-around space-around\" | \"space-around space-evenly\" | \"space-evenly normal\" | \"space-evenly start\" | \"space-evenly end\" | \"space-evenly center\" | \"space-evenly unsafe start\" | \"space-evenly unsafe end\" | \"space-evenly unsafe center\" | \"space-evenly safe start\" | \"space-evenly safe end\" | \"space-evenly safe center\" | \"space-evenly stretch\" | \"space-evenly space-between\" | \"space-evenly space-around\" | \"space-evenly space-evenly\"", - "description": "A shorthand property for `justify-content` and `align-content`.", + "description": "A shorthand for setting both `alignContent` and `justifyContent`.", "defaultValue": "'normal normal'" }, { @@ -4739,7 +5274,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows and columns.", "defaultValue": "'none'" }, { @@ -4747,7 +5282,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "s spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows.", "defaultValue": "'' - meaning no override" }, { @@ -4755,7 +5290,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid columns.", "defaultValue": "'' - meaning no override" }, { @@ -4763,7 +5298,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -4771,7 +5306,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -4779,7 +5314,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -4787,7 +5322,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -4795,7 +5330,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -4803,7 +5338,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -4811,7 +5346,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -4819,7 +5354,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -4827,7 +5362,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -4835,7 +5370,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -4843,7 +5378,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4851,7 +5386,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4859,7 +5394,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4867,7 +5402,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4875,7 +5410,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4883,7 +5418,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4891,7 +5426,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -4911,7 +5446,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -4919,7 +5454,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -4927,7 +5462,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -4935,7 +5470,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -4943,14 +5478,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -4958,9 +5493,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -5006,7 +5548,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5014,11 +5556,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n accessor gridTemplateColumns: GridProps['gridTemplateColumns'];\n accessor gridTemplateRows: GridProps['gridTemplateRows'];\n accessor justifyItems: GridProps['justifyItems'];\n accessor alignItems: GridProps['alignItems'];\n accessor placeItems: GridProps['placeItems'];\n accessor justifyContent: GridProps['justifyContent'];\n accessor alignContent: GridProps['alignContent'];\n accessor placeContent: GridProps['placeContent'];\n accessor gap: GridProps['gap'];\n accessor rowGap: GridProps['rowGap'];\n accessor columnGap: GridProps['columnGap'];\n}" + "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n /**\n * The template that defines the grid columns.\n */\n gridTemplateColumns: GridProps['gridTemplateColumns'];\n /**\n * The template that defines the grid rows.\n */\n gridTemplateRows: GridProps['gridTemplateRows'];\n /**\n * The alignment of grid items along the inline axis.\n */\n justifyItems: GridProps['justifyItems'];\n /**\n * The alignment of grid items along the block axis.\n */\n alignItems: GridProps['alignItems'];\n /**\n * A shorthand for setting both `alignItems` and `justifyItems`.\n */\n placeItems: GridProps['placeItems'];\n /**\n * The alignment of the grid along the inline axis.\n */\n justifyContent: GridProps['justifyContent'];\n /**\n * The alignment of the grid along the block axis.\n */\n alignContent: GridProps['alignContent'];\n /**\n * A shorthand for setting both `alignContent` and `justifyContent`.\n */\n placeContent: GridProps['placeContent'];\n /**\n * The spacing between grid rows and columns.\n */\n gap: GridProps['gap'];\n /**\n * The spacing between grid rows.\n */\n rowGap: GridProps['rowGap'];\n /**\n * The spacing between grid columns.\n */\n columnGap: GridProps['columnGap'];\n}" } }, "JustifyItemsKeyword": { @@ -5027,8 +5584,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "JustifyItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.\n\nLearn more about the [justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).", - "isPublicDocs": true + "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis." } }, "BaselinePosition": { @@ -5037,8 +5593,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BaselinePosition", "value": "'baseline' | 'first baseline' | 'last baseline'", - "description": "Represents baseline alignment positions used to align items relative to their baselines.\n- `baseline`: Aligns to the baseline of the parent.\n- `first baseline`: Aligns to the first baseline of the parent.\n- `last baseline`: Aligns to the last baseline of the parent.", - "isPublicDocs": true + "description": "" } }, "OverflowPosition": { @@ -5047,8 +5602,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "OverflowPosition", "value": "`unsafe ${ContentPosition}` | `safe ${ContentPosition}`", - "description": "Represents content positioning with overflow behavior control. Use `safe` to prevent content from becoming inaccessible when it overflows, or `unsafe` to allow overflow regardless of accessibility.", - "isPublicDocs": true + "description": "" } }, "ContentPosition": { @@ -5057,8 +5611,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "ContentPosition", "value": "'center' | 'start' | 'end'", - "description": "Defines the position of content along an axis.\n- `center`: Centers the content.\n- `start`: Aligns content to the start.\n- `end`: Aligns content to the end.", - "isPublicDocs": true + "description": "" } }, "AlignItemsKeyword": { @@ -5067,8 +5620,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "AlignItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Align items sets the align-self value on all direct children as a group.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isPublicDocs": true + "description": "Align items sets the align-self value on all direct children as a group." } }, "JustifyContentKeyword": { @@ -5077,8 +5629,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "JustifyContentKeyword", "value": "'normal' | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", - "isPublicDocs": true + "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container." } }, "ContentDistribution": { @@ -5087,8 +5638,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "ContentDistribution", "value": "'space-between' | 'space-around' | 'space-evenly' | 'stretch'", - "description": "Defines how space is distributed between and around content items in flex and grid layouts.\n- `space-between`: Distributes items evenly with the first item at the start and last at the end.\n- `space-around`: Distributes items evenly with equal space around each item.\n- `space-evenly`: Distributes items evenly with equal space between them.\n- `stretch`: Stretches items to fill the container.", - "isPublicDocs": true + "description": "" } }, "AlignContentKeyword": { @@ -5097,8 +5647,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "AlignContentKeyword", "value": "'normal' | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isPublicDocs": true + "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis." } }, "SpacingKeyword": { @@ -5107,23 +5656,21 @@ "syntaxKind": "TypeAliasDeclaration", "name": "SpacingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the spacing size between elements, using the standard size scale or `none` for no spacing.", - "isPublicDocs": true + "description": "" } }, "GridItem": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "GridItem", - "description": "The grid item component represents a single cell within a grid layout, allowing you to control how content is positioned and sized within the grid. Use grid item as a child of grid to specify column span, row span, and positioning for individual content areas.\n\nGrid item supports precise placement control through column and row properties, enabling you to create complex layouts where different items occupy varying amounts of space or appear in specific grid positions.", - "isPublicDocs": true, + "description": "A grid item is a child of a grid that can be positioned within specific rows and columns.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridColumn", "value": "\"auto\" | `span ${number}`", - "description": "The number of columns the item will span across.\n\nLearn more about the [grid-column property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).", + "description": "The column position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -5131,7 +5678,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridRow", "value": "\"auto\" | `span ${number}`", - "description": "The number of rows the item will span across.\n\nLearn more about the [grid-row property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).", + "description": "The row position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -5139,7 +5686,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -5147,7 +5694,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -5155,7 +5702,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -5163,7 +5710,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -5171,7 +5718,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -5179,7 +5726,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -5187,7 +5734,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -5195,7 +5742,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -5203,7 +5750,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -5211,7 +5758,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -5219,7 +5766,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -5227,7 +5774,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -5235,7 +5782,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -5243,7 +5790,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -5251,7 +5798,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -5259,7 +5806,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -5267,7 +5814,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -5287,7 +5834,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -5295,7 +5842,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -5303,7 +5850,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -5311,7 +5858,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -5319,14 +5866,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -5334,9 +5881,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -5382,7 +5936,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5390,26 +5944,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class GridItem extends BoxElement implements GridItemProps {\n accessor gridColumn: GridItemProps['gridColumn'];\n accessor gridRow: GridItemProps['gridRow'];\n constructor();\n}" + "value": "declare class GridItem extends BoxElement implements GridItemProps {\n /**\n * The column position and span of the grid item.\n */\n gridColumn: GridItemProps['gridColumn'];\n /**\n * The row position and span of the grid item.\n */\n gridRow: GridItemProps['gridRow'];\n constructor();\n}" } }, "Heading": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Heading", - "description": "Configure the following properties on the heading component.", - "isPublicDocs": true, + "description": "A custom element for displaying hierarchical section titles and headings with appropriate semantic meaning and visual styling. Use Heading to structure your content with proper heading levels for both visual hierarchy and accessibility.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"heading\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The ARIA role for the heading. Set to `'heading'` (the default) for standard heading semantics, or `'presentation'` / `'none'` to remove heading semantics for decorative use.", "defaultValue": "'heading'" }, { @@ -5417,7 +5985,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lineClamp", "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", "defaultValue": "Infinity - no truncation is applied" }, { @@ -5425,9 +5993,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -5473,7 +6048,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5481,49 +6056,63 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Heading extends PreactCustomElement implements HeadingProps {\n accessor accessibilityRole: HeadingProps['accessibilityRole'];\n accessor lineClamp: HeadingProps['lineClamp'];\n accessor accessibilityVisibility: HeadingProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Heading extends HeadingBase implements HeadingProps {\n constructor();\n}" } }, "Icon": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Icon", - "description": "Configure the following properties on the icon component.", - "isPublicDocs": true, + "description": "An icon displays a graphical symbol from the icon library.", "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", + "description": "The color tone of the icon based on its semantic meaning.", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "The icon to display from the icon library.\n\nSet to a valid icon name to display that icon. To hide the icon completely, use an empty string `''`. To reserve the icon's space without displaying an icon, use `'empty'`." + "value": "\"\" | IconType", + "description": "The type of icon to display." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color emphasis of the icon.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"base\"", - "description": "The size of the icon.\n\n- `small`: Smaller icon suitable for inline use within text or compact UI elements.\n- `base`: Default size that works well for standalone icons and standard use cases.", + "description": "The size of the icon.", "defaultValue": "'base'" }, { @@ -5531,7 +6120,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The element that this icon should show interest for when activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -5578,7 +6174,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5586,55 +6182,69 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Icon extends PreactCustomElement implements IconProps {\n accessor color: IconProps['color'];\n accessor tone: IconProps['tone'];\n accessor type: IconProps['type'];\n accessor size: IconProps['size'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Icon extends IconBase implements IconProps {\n /**\n * The color tone of the icon based on its semantic meaning.\n */\n tone: IconProps['tone'];\n /**\n * The type of icon to display.\n */\n type: IconProps['type'];\n constructor();\n}" } }, "Image": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Image", - "description": "Configure the following properties on the image component.", - "isPublicDocs": true, + "description": "An image displays pictures with configurable sizing, loading behavior, and borders.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "srcSet", "value": "string", - "description": "A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n\nLearn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset)." + "description": "A set of source images with different sizes for responsive loading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "sizes", "value": "string", - "description": "A set of media conditions and their corresponding sizes.\n\nLearn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes)." + "description": "The sizes of the image at different viewport widths." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "aspectRatio", "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", - "description": "The aspect ratio of the image.\n\nThe rendering of the image will depend on the `inlineSize` value:\n\n- `inlineSize=\"fill\"`: the aspect ratio will be respected and the image will take the necessary space.\n- `inlineSize=\"auto\"`: the image will not render until it has loaded and the aspect ratio will be ignored.\n\nFor example, if the value is set as `50 / 100`, the getter returns `50 / 100`. If the value is set as `0.5`, the getter returns `0.5 / 1`.\n\nLearn more about the [aspect-ratio property](https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio).", + "description": "The aspect ratio of the image as a width-to-height ratio.", "defaultValue": "'1/1'" }, { @@ -5642,7 +6252,7 @@ "syntaxKind": "PropertyDeclaration", "name": "objectFit", "value": "\"contain\" | \"cover\"", - "description": "The image resizing behavior to fit within its container.\n\n- `contain`: Scales the image to fit within the container while maintaining its aspect ratio. The entire image is visible, but might leave empty space.\n- `cover`: Scales the image to fill the entire container while maintaining its aspect ratio. The image might be cropped to fit.\n\nThe image is always positioned in the center of the container.\n\nLearn more about the [object-fit property](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).", + "description": "How the image should be resized to fit its container.", "defaultValue": "'contain'" }, { @@ -5650,7 +6260,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "\"eager\" | \"lazy\"", - "description": "The loading strategy for the image.\n\n- `eager`: Immediately loads the image, irrespective of its position within the visible viewport.\n- `lazy`: Delays loading the image until it approaches a specified distance from the viewport.\n\nLearn more about the [loading attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading).", + "description": "When the image should be loaded.", "defaultValue": "'eager'" }, { @@ -5658,7 +6268,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"img\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The accessibility role for the image.", "defaultValue": "'img'" }, { @@ -5666,7 +6276,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "\"auto\" | \"fill\"", - "description": "The displayed inline width of the image.\n\n- `fill`: the image will takes up 100% of the available inline size.\n- `auto`: the image will be displayed at its natural size.\n\nLearn more about the [width attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#width).", + "description": "The inline size (width in horizontal writing modes) of the image.", "defaultValue": "'fill'" }, { @@ -5674,35 +6284,23 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied around the image using shorthand syntax to specify width, color, and style in a single property.", - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "description": "Whether to show a border around the image.", + "defaultValue": "'none' - equivalent to `none base auto`." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderWidth", - "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderStyle", - "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image.", "defaultValue": "'' - meaning no override" }, { @@ -5710,17 +6308,24 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "The color of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the image's corners using the design system's radius scale.", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image.", "defaultValue": "'none'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -5766,7 +6371,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5774,26 +6379,49 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Image extends PreactCustomElement implements ImageProps {\n accessor src: ImageProps['src'];\n accessor srcSet: ImageProps['srcSet'];\n accessor sizes: ImageProps['sizes'];\n accessor alt: ImageProps['alt'];\n accessor aspectRatio: ImageProps['aspectRatio'];\n accessor objectFit: ImageProps['objectFit'];\n accessor loading: ImageProps['loading'];\n accessor accessibilityRole: ImageProps['accessibilityRole'];\n accessor inlineSize: ImageProps['inlineSize'];\n /**\n * A border applied around the image using shorthand syntax to specify width, color, and style in a single property.\n */\n accessor border: ImageProps['border'];\n /**\n * The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.\n */\n accessor borderWidth: ImageProps['borderWidth'];\n /**\n * The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.\n */\n accessor borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.\n */\n accessor borderColor: ImageProps['borderColor'];\n /**\n * The roundedness of the image's corners using the design system's radius scale.\n */\n accessor borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + "value": "declare class Image extends PolarisCustomElement implements ImageProps {\n /**\n * The URL of the image to display.\n */\n src: ImageProps['src'];\n /**\n * A set of source images with different sizes for responsive loading.\n */\n srcSet: ImageProps['srcSet'];\n /**\n * The sizes of the image at different viewport widths.\n */\n sizes: ImageProps['sizes'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ImageProps['alt'];\n /**\n * The aspect ratio of the image as a width-to-height ratio.\n */\n aspectRatio: ImageProps['aspectRatio'];\n /**\n * How the image should be resized to fit its container.\n */\n objectFit: ImageProps['objectFit'];\n /**\n * When the image should be loaded.\n */\n loading: ImageProps['loading'];\n /**\n * The accessibility role for the image.\n */\n accessibilityRole: ImageProps['accessibilityRole'];\n /**\n * The inline size (width in horizontal writing modes) of the image.\n */\n inlineSize: ImageProps['inlineSize'];\n /**\n * Whether to show a border around the image.\n */\n border: ImageProps['border'];\n /**\n * The width of the border around the image.\n */\n borderWidth: ImageProps['borderWidth'];\n /**\n * The style of the border around the image.\n */\n borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image.\n */\n borderColor: ImageProps['borderColor'];\n /**\n * The radius of the border corners around the image.\n */\n borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + } + }, + "BorderRadiusKeyword": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "BorderRadiusKeyword", + "value": "SizeKeyword | 'max' | 'none'", + "description": "" } }, "Link": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Link", - "description": "Configure the following properties on the link component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", "defaultValue": "'auto'" }, { @@ -5801,21 +6429,21 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -5823,14 +6451,21 @@ "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "lang", "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)." + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -5877,7 +6512,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5885,15 +6520,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -5901,26 +6551,32 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Link extends Link_base implements LinkProps {\n accessor tone: LinkProps['tone'];\n accessor accessibilityLabel: LinkProps['accessibilityLabel'];\n accessor href: LinkProps['href'];\n accessor target: LinkProps['target'];\n accessor download: LinkProps['download'];\n accessor lang: LinkProps['lang'];\n constructor();\n}" + "value": "declare class Link extends LinkBase implements LinkProps {\n tone: LinkProps['tone'];\n constructor();\n}" } }, "ListItem": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItem", - "description": "The list item component represents a single entry within an ordered list or unordered list. Use list item to structure individual points, steps, or items within a list, with each item automatically receiving appropriate list markers (bullets or numbers) from its parent list.\n\nList item must be used as a direct child of ordered list or unordered list components. Each list item can contain text, inline formatting, or other components to create rich list content.", - "isPublicDocs": true, + "description": "A component that represents a single item within an ordered list or unordered list.\n\nUse list item as a child of ordered list or unordered list to create properly structured and accessible list content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -5966,7 +6622,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5974,26 +6630,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ListItem extends PreactCustomElement implements ListItemProps {\n constructor();\n}" + "value": "declare class ListItem extends PolarisCustomElement implements ListItemProps {\n constructor();\n}" } }, "Menu": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Menu", - "description": "Configure the following properties on the menu component.", - "isPublicDocs": true, + "description": "A component that displays a contextual list of actions or options, which is typically triggered by a button or other activator element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the menu for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", @@ -6014,7 +6684,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@2598", + "name": "__@overlayHidden@7525", "value": "boolean", "description": "", "isPrivate": true @@ -6022,7 +6692,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@2599", + "name": "__@overlayActivator@7526", "value": "HTMLElement", "description": "", "isPrivate": true @@ -6030,11 +6700,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@2600", + "name": "__@overlayHideFrameId@7527", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6064,7 +6741,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6072,26 +6749,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n accessor accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n /**\n * A label that describes the menu for assistive technologies.\n */\n accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" } }, "MoneyField": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "MoneyField", - "description": "Configure the following properties on the money field component.", - "isPublicDocs": true, + "description": "The money field custom element class that renders a monetary input field in the Shopify admin interface. This component allows merchants to enter currency amounts with automatic formatting, decimal precision, and validation against minimum and maximum values.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum monetary value allowed in the field.", "defaultValue": "Infinity" }, { @@ -6099,9 +6790,17 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum monetary value allowed in the field.", "defaultValue": "-Infinity" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "currencyCode", + "value": "\"auto\" | CurrencyCode", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -6114,7 +6813,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "string", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -6122,35 +6821,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -6158,14 +6857,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -6173,7 +6872,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -6197,7 +6896,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -6221,7 +6920,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -6229,23 +6928,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@2229", + "name": "__@internals$4@7093", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6283,7 +6989,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6291,19 +6997,42 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class MoneyField\n extends PreactFieldElement\n implements MoneyFieldProps\n{\n accessor max: MoneyFieldProps['max'];\n accessor min: MoneyFieldProps['min'];\n /**\n * The current monetary value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string representing the amount in the store's currency.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class MoneyField extends MoneyFieldBase implements MoneyFieldProps {\n constructor();\n}" + } + }, + "CurrencyCode": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CurrencyCode", + "value": "'USD' | 'EUR' | 'GBP' | 'CAD' | 'AFN' | 'ALL' | 'DZD' | 'AOA' | 'ARS' | 'AMD' | 'AWG' | 'AUD' | 'BBD' | 'AZN' | 'BDT' | 'BSD' | 'BHD' | 'BIF' | 'BZD' | 'BMD' | 'BTN' | 'BAM' | 'BRL' | 'BOB' | 'BWP' | 'BND' | 'BGN' | 'MMK' | 'KHR' | 'CVE' | 'KYD' | 'XAF' | 'CLP' | 'CNY' | 'COP' | 'KMF' | 'CDF' | 'CRC' | 'HRK' | 'CZK' | 'DKK' | 'DOP' | 'XCD' | 'EGP' | 'ETB' | 'XPF' | 'FJD' | 'GMD' | 'GHS' | 'GTQ' | 'GYD' | 'GEL' | 'HTG' | 'HNL' | 'HKD' | 'HUF' | 'ISK' | 'INR' | 'IDR' | 'ILS' | 'IQD' | 'JMD' | 'JPY' | 'JEP' | 'JOD' | 'KZT' | 'KES' | 'KWD' | 'KGS' | 'LAK' | 'LVL' | 'LBP' | 'LSL' | 'LRD' | 'LTL' | 'MGA' | 'MKD' | 'MOP' | 'MWK' | 'MVR' | 'MXN' | 'MYR' | 'MUR' | 'MDL' | 'MAD' | 'MNT' | 'MZN' | 'NAD' | 'NPR' | 'ANG' | 'NZD' | 'NIO' | 'NGN' | 'NOK' | 'OMR' | 'PAB' | 'PKR' | 'PGK' | 'PYG' | 'PEN' | 'PHP' | 'PLN' | 'QAR' | 'RON' | 'RUB' | 'RWF' | 'WST' | 'SAR' | 'RSD' | 'SCR' | 'SGD' | 'SDG' | 'SYP' | 'ZAR' | 'KRW' | 'SSP' | 'SBD' | 'LKR' | 'SRD' | 'SZL' | 'SEK' | 'CHF' | 'TWD' | 'THB' | 'TZS' | 'TTD' | 'TND' | 'TRY' | 'TMT' | 'UGX' | 'UAH' | 'AED' | 'UYU' | 'UZS' | 'VUV' | 'VND' | 'XOF' | 'YER' | 'ZMW' | 'BYN' | 'BYR' | 'DJF' | 'ERN' | 'FKP' | 'GIP' | 'GNF' | 'IRR' | 'KID' | 'LYD' | 'MRU' | 'SLL' | 'SHP' | 'SOS' | 'STD' | 'STN' | 'TJS' | 'TOP' | 'VED' | 'VEF' | 'VES' | 'XXX'", + "description": "" } }, "NumberField": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "NumberField", - "description": "Configure the following properties on the number field component.", - "isPublicDocs": true, + "description": "The number field custom element class that renders a numeric input field in the Shopify admin interface. This component allows merchants to enter numbers with automatic validation and prefix/suffix display.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -6317,7 +7046,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inputMode", "value": "\"decimal\" | \"numeric\"", - "description": "The type of virtual keyboard to display on mobile devices.\n\n- `decimal`: Shows a numeric keyboard with a decimal point, suitable for prices or measurements.\n- `numeric`: Shows a numeric keyboard without a decimal point, suitable for whole numbers like quantities.\n\nLearn more about the [inputmode attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode).", + "description": "The input mode hint for mobile keyboards. Available values include:\n- `numeric`: Shows a numeric keypad optimized for entering numbers\n- `decimal`: Shows a numeric keypad with decimal point support\n- `tel`: Shows a telephone keypad", "defaultValue": "'decimal'" }, { @@ -6325,7 +7054,7 @@ "syntaxKind": "PropertyDeclaration", "name": "step", "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "description": "The granularity that the value must adhere to, or the keyword `any`. This controls the increment/decrement step size.", "defaultValue": "1" }, { @@ -6333,7 +7062,7 @@ "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum numeric value allowed in the field.", "defaultValue": "Infinity" }, { @@ -6341,7 +7070,7 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum numeric value allowed in the field.", "defaultValue": "-Infinity" }, { @@ -6349,7 +7078,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the user's input, such as a currency symbol.", "defaultValue": "''" }, { @@ -6357,7 +7086,7 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the user's input, such as a unit of measurement.", "defaultValue": "''" }, { @@ -6365,7 +7094,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | NumberAutocompleteField | `section-${string} one-time-code` | `section-${string} cc-number` | `section-${string} cc-csc` | \"shipping one-time-code\" | \"shipping cc-number\" | \"shipping cc-csc\" | \"billing one-time-code\" | \"billing cc-number\" | \"billing cc-csc\" | `section-${string} shipping one-time-code` | `section-${string} shipping cc-number` | `section-${string} shipping cc-csc` | `section-${string} billing one-time-code` | `section-${string} billing cc-number` | `section-${string} billing cc-csc`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -6373,35 +7102,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -6409,14 +7138,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -6424,7 +7153,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -6448,7 +7177,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -6472,7 +7201,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -6480,23 +7209,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@2229", + "name": "__@internals$4@7093", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6534,7 +7270,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6542,11 +7278,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class NumberField\n extends PreactFieldElement\n implements NumberFieldProps\n{\n /**\n * The current numeric value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string (decimal or integer).\n */\n get value(): string;\n set value(value: string);\n accessor inputMode: NumberFieldProps['inputMode'];\n accessor step: NumberFieldProps['step'];\n accessor max: NumberFieldProps['max'];\n accessor min: NumberFieldProps['min'];\n accessor prefix: NumberFieldProps['prefix'];\n accessor suffix: NumberFieldProps['suffix'];\n constructor();\n}" + "value": "declare class NumberField extends NumberFieldBase implements NumberFieldProps {\n constructor();\n}" } }, "NumberAutocompleteField": { @@ -6555,23 +7306,21 @@ "syntaxKind": "TypeAliasDeclaration", "name": "NumberAutocompleteField", "value": "'one-time-code' | 'cc-number' | 'cc-csc'", - "description": "Represents autocomplete values that are valid for number input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for numeric inputs.\n\nAvailable values:\n- `one-time-code` - One-time codes for authentication (OTP, 2FA codes)\n- `cc-number` - Credit card number\n- `cc-csc` - Credit card security code (CVV/CVC)", - "isPublicDocs": true + "description": "" } }, "Option": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Option", - "description": "Represents a single option within a select component. Use only as a child of s-select components.", - "isPublicDocs": true, + "description": "A single option within a select dropdown that users can choose.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the option is currently selected.", "defaultValue": "false" }, { @@ -6579,7 +7328,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the option should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -6587,16 +7336,23 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this option is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the option is disabled and can't be selected.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6642,7 +7398,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6650,26 +7406,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Option extends PreactCustomElement implements OptionProps {\n accessor selected: OptionProps['selected'];\n accessor defaultSelected: OptionProps['defaultSelected'];\n accessor value: OptionProps['value'];\n accessor disabled: OptionProps['disabled'];\n constructor();\n}" + "value": "declare class Option extends PolarisCustomElement implements OptionProps {\n /**\n * Whether the option is currently selected.\n */\n selected: OptionProps['selected'];\n /**\n * Whether the option should be selected when it's first rendered.\n */\n defaultSelected: OptionProps['defaultSelected'];\n /**\n * The value that's submitted with the form when this option is selected.\n */\n value: OptionProps['value'];\n /**\n * Whether the option is disabled and can't be selected.\n */\n disabled: OptionProps['disabled'];\n constructor();\n}" } }, "OptionGroup": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionGroup", - "description": "Represents a group of options within a select component. Use only as a child of `s-select` components.", - "isPublicDocs": true, + "description": "A group of related options within a select dropdown, displayed with a label.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the options within this group can be selected or not.", + "description": "Whether all options in the group are disabled and can't be selected.", "defaultValue": "false" }, { @@ -6677,7 +7447,14 @@ "syntaxKind": "PropertyDeclaration", "name": "label", "value": "string", - "description": "The user-facing label for this group of options." + "description": "The text that describes what this group of options represents." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -6724,7 +7501,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6732,20 +7509,41 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OptionGroup\n extends PreactCustomElement\n implements OptionGroupProps\n{\n accessor disabled: OptionGroupProps['disabled'];\n accessor label: OptionGroupProps['label'];\n constructor();\n}" + "value": "declare class OptionGroup\n extends PolarisCustomElement\n implements OptionGroupProps\n{\n /**\n * Whether all options in the group are disabled and can't be selected.\n */\n disabled: OptionGroupProps['disabled'];\n /**\n * The text that describes what this group of options represents.\n */\n label: OptionGroupProps['label'];\n constructor();\n}" } }, "OrderedList": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "OrderedList", - "description": "Configure the following properties on the ordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a numbered list of items with automatic numbering and proper list semantics. Use ordered list when the sequence or order of items matters, such as instructions, rankings, or step-by-step processes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6791,7 +7589,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6799,50 +7597,64 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OrderedList\n extends PreactCustomElement\n implements OrderedListProps\n{\n constructor();\n}" + "value": "declare class OrderedList\n extends PolarisCustomElement\n implements OrderedListProps\n{\n constructor();\n}" } }, "Paragraph": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Paragraph", - "description": "Configure the following properties on the paragraph component.", - "isPublicDocs": true, + "description": "A custom element for displaying blocks of text content with consistent spacing and styling for readable body copy. Use Paragraph to render longer text content with proper line height and spacing between paragraphs.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "lineClamp", - "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", - "defaultValue": "Infinity - no truncation is applied" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the paragraph text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"caution\"", - "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "lineClamp", + "value": "number", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", + "defaultValue": "Infinity - no truncation is applied" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color of the paragraph text.", "defaultValue": "'base'" }, { @@ -6850,7 +7662,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -6858,9 +7670,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6906,7 +7725,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6914,26 +7733,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Paragraph extends PreactCustomElement implements ParagraphProps {\n accessor fontVariantNumeric: ParagraphProps['fontVariantNumeric'];\n accessor lineClamp: ParagraphProps['lineClamp'];\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: ParagraphProps['tone'];\n\n accessor color: ParagraphProps['color'];\n accessor dir: ParagraphProps['dir'];\n accessor accessibilityVisibility: ParagraphProps['accessibilityVisibility'];\n constructor();\n}" - } - }, - "PasswordField": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "PasswordField", - "description": "Configure the following properties on the password field component.", - "isPublicDocs": true, + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Paragraph extends ParagraphBase implements ParagraphProps {\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: ParagraphProps['tone'];\n constructor();\n}" + } + }, + "PasswordField": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "PasswordField", + "description": "The password field custom element class that renders a password input field in the Shopify admin interface. This component allows merchants to enter passwords securely with characters automatically masked for privacy.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the password.", "defaultValue": "Infinity" }, { @@ -6941,22 +7774,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the password.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | PasswordAutocompleteField | `section-${string} current-password` | `section-${string} new-password` | \"shipping current-password\" | \"shipping new-password\" | \"billing current-password\" | \"billing new-password\" | `section-${string} shipping current-password` | `section-${string} shipping new-password` | `section-${string} billing current-password` | `section-${string} billing new-password`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -6964,35 +7790,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -7000,14 +7826,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -7015,7 +7841,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -7039,7 +7865,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -7063,7 +7889,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -7071,23 +7897,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@2229", + "name": "__@internals$4@7093", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7125,7 +7965,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7133,11 +7973,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class PasswordField\n extends PreactFieldElement\n implements PasswordFieldProps\n{\n accessor maxLength: PasswordFieldProps['maxLength'];\n accessor minLength: PasswordFieldProps['minLength'];\n /**\n * The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class PasswordField\n extends PasswordFieldBase\n implements PasswordFieldProps\n{\n constructor();\n}" } }, "PasswordAutocompleteField": { @@ -7146,25 +8001,30 @@ "syntaxKind": "TypeAliasDeclaration", "name": "PasswordAutocompleteField", "value": "'current-password' | 'new-password'", - "description": "Represents autocomplete values that are valid for password input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for password inputs.\n\nAvailable values:\n- `current-password` - Existing password for login or authentication\n- `new-password` - New password when creating an account or changing password", - "isPublicDocs": true + "description": "" } }, "QueryContainer": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "QueryContainer", - "description": "Configure the following properties on the query container component.", - "isPublicDocs": true, + "description": "A component that sets up a container query context, which lets child elements style themselves based on the container's size instead of the viewport size.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "containerName", "value": "string", - "description": "An identifier for this container that you can reference in CSS container queries to apply styles based on this specific container's size.\n\nAll query container components automatically receive a container name of `s-default`. You can omit the container name in your queries, so `@container (inline-size <= 300px)` is equivalent to `@container s-default (inline-size <= 300px)`.\n\nWhen you provide a custom `containerName`, it's added alongside `s-default`. For example, `containerName=\"product-card\"` results in `s-default product-card` being set on the `container-name` CSS property, allowing you to target this container with `@container product-card (inline-size <= 300px)`.\n\nLearn more about the [container-name property](https://developer.mozilla.org/en-US/docs/Web/CSS/container-name).", + "description": "The name of the container, which you can reference in CSS container queries.", "defaultValue": "''" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7210,7 +8070,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7218,26 +8078,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class QueryContainer\n extends PreactCustomElement\n implements QueryContainerProps\n{\n accessor containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" + "value": "declare class QueryContainer\n extends PolarisCustomElement\n implements QueryContainerProps\n{\n /**\n * The name of the container, which you can reference in CSS container queries.\n */\n containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" } }, "SearchField": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "SearchField", - "description": "Configure the following properties on the search field component.", - "isPublicDocs": true, + "description": "A search field that lets users enter search queries with a search-specific input type.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters that can be entered in the field.", "defaultValue": "Infinity" }, { @@ -7245,22 +8119,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters that must be entered for the field to be valid.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -7268,35 +8135,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -7304,14 +8171,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -7319,7 +8186,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -7343,7 +8210,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -7367,7 +8234,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -7375,23 +8242,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@2229", + "name": "__@internals$4@7093", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7429,7 +8310,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7437,11 +8318,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class SearchField\n extends PreactFieldElement\n implements SearchFieldProps\n{\n accessor maxLength: SearchFieldProps['maxLength'];\n accessor minLength: SearchFieldProps['minLength'];\n /**\n * The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class SearchField extends SearchFieldBase implements SearchFieldProps {\n constructor();\n}" } }, "TextAutocompleteField": { @@ -7449,17 +8345,15 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" } }, "Section": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Section", - "description": "Configure the following properties on the section component.", - "isPublicDocs": true, + "description": "A section is a container that groups related content together with an optional heading.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -7469,28 +8363,43 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "The accessibility label for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The heading text displayed at the top of the section. This heading provides a title for the section's content and automatically uses the appropriate semantic heading level (h2, h3, h4) based on nesting depth to maintain proper document structure." + "description": "The heading text for the section." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "\"base\" | \"none\"", - "description": "The padding applied to all edges of the element.\n\n- `base`: applies padding that is appropriate for the element. Note that it might result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the section need to span to the edge of the section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "description": "Whether the section has padding.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7507,14 +8416,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7528,7 +8429,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7536,61 +8437,75 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Section extends PreactCustomElement implements SectionProps {\n constructor();\n /** @private */\n connectedCallback(): void;\n accessor accessibilityLabel: SectionProps['accessibilityLabel'];\n accessor heading: SectionProps['heading'];\n accessor padding: SectionProps['padding'];\n}" + "value": "declare class Section extends SectionBase implements SectionProps {\n constructor();\n}" } }, "Select": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Select", - "description": "Configure the following properties on the select component.", - "isPublicDocs": true, + "description": "A select dropdown that lets users choose one option from a list.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier." + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the select." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the select when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the select is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "Text that appears in the select when no option is selected to provide a hint about what to choose." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether an option must be selected before the form can be submitted.", "defaultValue": "false" }, { @@ -7598,7 +8513,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -7622,7 +8537,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component." + "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected Option component." }, { "filePath": "src/surfaces/admin/components.ts", @@ -7635,15 +8550,15 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@usedFirstOptionSymbol@2877", + "name": "__@usedFirstOptionSymbol@7870", "value": "boolean", - "description": "A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n\nThis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.", + "description": "used to determine if no value or defaultValue was set, in which case the first non-disabled option was used\n\nthis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@hasInitialValueSymbol@2878", + "name": "__@hasInitialValueSymbol@7871", "value": "boolean", "description": "", "isPrivate": true @@ -7653,7 +8568,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -7661,23 +8576,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@2229", + "name": "__@internals$4@7093", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7707,7 +8629,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7715,35 +8637,56 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Select extends PreactInputElement implements SelectProps {\n accessor icon: SelectProps['icon'];\n accessor details: SelectProps['details'];\n accessor error: SelectProps['error'];\n accessor label: SelectProps['label'];\n accessor placeholder: SelectProps['placeholder'];\n accessor required: SelectProps['required'];\n accessor labelAccessibilityVisibility: SelectProps['labelAccessibilityVisibility'];\n /** @private */\n connectedCallback(): void;\n /**\n * A lifecycle callback that fires when the component is removed from the DOM. Performs cleanup operations.\n * @private\n */\n disconnectedCallback(): void;\n constructor();\n /**\n * A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n *\n * This is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.\n * @private\n */\n [usedFirstOptionSymbol]: boolean;\n /**\n * @private\n */\n [hasInitialValueSymbol]: boolean;\n /**\n * The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component.\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n}" + "value": "declare class Select extends SelectBase implements SelectProps {\n constructor();\n}" } }, "Spinner": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Spinner", - "description": "Configure the following properties on the spinner component.", - "isPublicDocs": true, + "description": "A component that displays an animated loading indicator to show that content is currently being processed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the spinner for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the loading spinner.\n\n- `base`: Default size suitable for inline loading indicators or standard UI contexts.\n- `large`: Larger spinner for more prominent loading states.\n- `large-100`: Extra large spinner for full-page or emphasized loading states.", + "description": "The size of the spinner.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7789,7 +8732,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7797,26 +8740,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Spinner extends PreactCustomElement implements SpinnerProps {\n accessor accessibilityLabel: string;\n accessor size: SpinnerProps['size'];\n constructor();\n}" + "value": "declare class Spinner extends PolarisCustomElement implements SpinnerProps {\n /**\n * A label that describes the spinner for assistive technologies.\n */\n accessibilityLabel: string;\n /**\n * The size of the spinner.\n */\n size: SpinnerProps['size'];\n constructor();\n}" } }, "Stack": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Stack", - "description": "Configure the following properties on the stack component.", - "isPublicDocs": true, + "description": "A stack is a layout component that arranges its children in a single direction with controlled spacing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "direction", "value": "MaybeResponsive<\"inline\" | \"block\">", - "description": "The direction in which the stack's children are placed within the stack.\n\nAccepts:\n- A single value, either `inline` or `block`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported direction values as a query value", + "description": "The direction in which the stack's children are arranged.", "defaultValue": "'block'" }, { @@ -7824,7 +8781,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "JustifyContentKeyword", - "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -7832,7 +8789,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "AlignItemsKeyword", - "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -7840,7 +8797,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "AlignContentKeyword", - "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.", "defaultValue": "'normal'" }, { @@ -7848,7 +8805,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between the stack's children.", "defaultValue": "'none'" }, { @@ -7856,7 +8813,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between rows in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -7864,7 +8821,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between columns in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -7872,7 +8829,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -7880,7 +8837,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -7888,7 +8845,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -7896,7 +8853,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -7904,7 +8861,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -7912,7 +8869,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -7920,7 +8877,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -7928,7 +8885,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -7936,7 +8893,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -7944,7 +8901,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -7952,7 +8909,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -7960,7 +8917,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -7968,7 +8925,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -7976,7 +8933,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -7984,7 +8941,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -7992,7 +8949,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -8000,7 +8957,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -8020,7 +8977,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -8028,7 +8985,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -8036,7 +8993,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -8044,7 +9001,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -8052,14 +9009,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -8067,9 +9024,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8115,7 +9079,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8123,34 +9087,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n accessor direction: StackProps['direction'];\n accessor justifyContent: StackProps['justifyContent'];\n accessor alignItems: StackProps['alignItems'];\n accessor alignContent: StackProps['alignContent'];\n accessor gap: StackProps['gap'];\n accessor rowGap: StackProps['rowGap'];\n accessor columnGap: StackProps['columnGap'];\n}" + "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n /**\n * The direction in which the stack's children are arranged.\n */\n direction: StackProps['direction'];\n /**\n * Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n */\n justifyContent: StackProps['justifyContent'];\n /**\n * Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n */\n alignItems: StackProps['alignItems'];\n /**\n * Controls the distribution of lines along the block axis when content wraps into multiple lines.\n */\n alignContent: StackProps['alignContent'];\n /**\n * The spacing between the stack's children.\n */\n gap: StackProps['gap'];\n /**\n * The spacing between rows in the stack.\n */\n rowGap: StackProps['rowGap'];\n /**\n * The spacing between columns in the stack.\n */\n columnGap: StackProps['columnGap'];\n}" } }, "Switch": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Switch", - "description": "Configure the following properties on the switch component.", - "isPublicDocs": true, + "description": "A switch that lets users toggle a setting on or off with a sliding control.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -8165,7 +9150,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -8173,28 +9158,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -8217,7 +9202,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -8225,23 +9210,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@2229", + "name": "__@internals$4@7093", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8287,7 +9279,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8295,26 +9287,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Switch extends PreactCheckboxElement implements SwitchProps {\n accessor labelAccessibilityVisibility: SwitchProps['labelAccessibilityVisibility'];\n constructor();\n}" + "value": "declare class Switch extends SwitchBase implements SwitchProps {\n constructor();\n}" } }, "Table": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Table", - "description": "Configure the following properties on the table component.", - "isPublicDocs": true, + "description": "A component that displays data in a structured table format that automatically adapts to the available space.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "variant", "value": "\"auto\" | \"list\"", - "description": "The layout variant of the table component.\n\n- `list`: Always displays as a list layout.\n- `table`: Always displays as a traditional table layout.\n- `auto`: Automatically displays as a table on wide screens and as a list on narrow screens.", + "description": "The display variant of the table.", "defaultValue": "'auto'" }, { @@ -8322,7 +9328,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table. When `true`, the table might be in an inert state that prevents user interaction.", + "description": "Whether the table is currently in a loading state.", "defaultValue": "false" }, { @@ -8330,7 +9336,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paginate", "value": "boolean", - "description": "Whether to use pagination controls.", + "description": "Whether the pagination controls are displayed.", "defaultValue": "false" }, { @@ -8338,7 +9344,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hasPreviousPage", "value": "boolean", - "description": "Whether there's a previous page of data.", + "description": "Whether there's a previous page of data that the user can navigate to.", "defaultValue": "false" }, { @@ -8346,25 +9352,40 @@ "syntaxKind": "PropertyDeclaration", "name": "hasNextPage", "value": "boolean", - "description": "Whether there's an additional page of data.", + "description": "Whether there's a next page of data that the user can navigate to.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@actualTableVariantSymbol@2953", - "value": "AddedContext", + "name": "__@elementInternals@7952", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@actualTableVariantSymbol@7950", + "value": "_shopify_admin_web_component_foundations.AddedContext", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@tableHeadersSharedDataSymbol@2954", - "value": "AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", + "name": "__@tableHeadersSharedDataSymbol@7951", + "value": "_shopify_admin_web_component_foundations.AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8410,7 +9431,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8418,59 +9439,35 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Table extends PreactCustomElement implements TableProps {\n accessor variant: TableProps['variant'];\n accessor loading: TableProps['loading'];\n accessor paginate: TableProps['paginate'];\n accessor hasPreviousPage: TableProps['hasPreviousPage'];\n accessor hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" + "value": "declare class Table extends PolarisCustomElement implements TableProps {\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The display variant of the table.\n */\n variant: TableProps['variant'];\n /**\n * Whether the table is currently in a loading state.\n */\n loading: TableProps['loading'];\n /**\n * Whether the pagination controls are displayed.\n */\n paginate: TableProps['paginate'];\n /**\n * Whether there's a previous page of data that the user can navigate to.\n */\n hasPreviousPage: TableProps['hasPreviousPage'];\n /**\n * Whether there's a next page of data that the user can navigate to.\n */\n hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: _shopify_admin_web_component_foundations.AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: _shopify_admin_web_component_foundations.AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" } }, - "AddedContext": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AddedContext", - "description": "", - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "T", - "description": "The current context value.\n\nThe new context value to set, which will notify all consumers." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "addEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", - "description": "The **`addEventListener()`** method of the EventTarget interface sets up a function that will be called whenever the specified event is delivered to the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener)" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "dispatchEvent", - "value": "(event: Event) => boolean", - "description": "The **`dispatchEvent()`** method of the EventTarget sends an Event to the object, (synchronously) invoking the affected event listeners in the appropriate order.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/dispatchEvent)" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "removeEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", - "description": "The **`removeEventListener()`** method of the EventTarget interface removes an event listener previously registered with EventTarget.addEventListener() from the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/removeEventListener)" - } - ], - "value": "declare class AddedContext extends EventTarget {\n constructor(defaultValue: T);\n /**\n * The current context value.\n */\n get value(): T;\n /**\n * The new context value to set, which will notify all consumers.\n */\n set value(value: T);\n}" - } - }, - "ActualTableVariant": { + "ActualTableVariant": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ActualTableVariant", "value": "'table' | 'list'", - "description": "Represents the actual rendered variant of a table component.\n- `table`: Displays as a traditional table layout.\n- `list`: Displays as a list layout.", - "isPublicDocs": true + "description": "" } }, "ListSlotType": { @@ -8479,8 +9476,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "ListSlotType", "value": "'primary' | 'secondary' | 'kicker' | 'inline' | 'labeled'", - "description": "Represents the semantic type of content slots within list items.\n\n- `primary`: The main content or title of the list item.\n- `secondary`: Supporting or descriptive content below the primary content.\n- `kicker`: A small label or tag displayed above the primary content.\n- `inline`: Content displayed inline with the primary content.\n- `labeled`: Content with an associated label.", - "isPublicDocs": true + "description": "" } }, "HeaderFormat": { @@ -8489,7 +9485,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true } }, @@ -8497,9 +9493,23 @@ "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "TableBody", - "description": "The table body component represents the main content area of a table, containing the data rows. Use table body as a child of table to structure your table data, with each table row within the body representing a single record or entry.\n\nTable body must contain table row components, which in turn contain table cell components for the actual data values.", - "isPublicDocs": true, + "description": "A component that wraps the body content of a table, which contains the data rows.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@7952", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8545,7 +9555,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8553,28 +9563,57 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableBody extends PreactCustomElement implements TableBodyProps {\n constructor();\n}" + "value": "declare class TableBody extends PolarisCustomElement implements TableBodyProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n}" } }, "TableCell": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "TableCell", - "description": "The table cell component represents a single data cell within a table row. Use table cell as a child of table row to display individual data values, with each cell corresponding to a column in the table.\n\nTable cell automatically inherits styling and alignment from its parent table structure and supports text content or other inline components.", - "isPublicDocs": true, + "description": "A component that represents a single cell in a table row, which displays data in a format that's determined by its column header.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@7952", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", - "name": "__@headerFormatSymbol@2976", + "name": "__@headerFormatSymbol@7978", "value": "HeaderFormat", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8620,7 +9659,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8628,26 +9667,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableCell extends PreactCustomElement implements TableCellProps {\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" + "value": "declare class TableCell extends PolarisCustomElement implements TableCellProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" } }, "TableHeader": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeader", - "description": "The table header component represents a single column header within a table header row. Use table header as a child of table header row to define column headings and optionally enable column sorting.\n\nTable header provides semantic meaning for screen readers and can include sorting controls when configured. Each header corresponds to a column in the table body.", - "isPublicDocs": true, + "description": "A component that defines a column header in a table, which specifies both the header label and how the column's data should be formatted.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "listSlot", "value": "ListSlotType", - "description": "The content designation for this column when the table displays in list variant on mobile devices.", + "description": "The slot where this header's data appears when the table is shown in list view.", "defaultValue": "'labeled'" }, { @@ -8655,7 +9708,22 @@ "syntaxKind": "PropertyDeclaration", "name": "format", "value": "HeaderFormat", - "description": "The format of the column that controls styling and alignment of cell content." + "description": "The format of the header and its corresponding cells." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@7952", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -8702,7 +9770,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8710,19 +9778,33 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeader\n extends PreactCustomElement\n implements TableHeaderProps\n{\n accessor listSlot: TableHeaderProps['listSlot'];\n accessor format: TableHeaderProps['format'];\n constructor();\n}" + "value": "declare class TableHeader\n extends PolarisCustomElement\n implements TableHeaderProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The slot where this header's data appears when the table is shown in list view.\n */\n listSlot: TableHeaderProps['listSlot'];\n /**\n * The format of the header and its corresponding cells.\n */\n format: TableHeaderProps['format'];\n constructor();\n}" } }, "TableHeaderRow": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeaderRow", - "description": "The table header row component represents the header row of a table, containing column headings. Use table header row as the first child of table (before table body) to define the table structure and provide column labels.\n\nTable header row must contain table header components for each column. These headers provide context for the data columns and can support sorting functionality.", - "isPublicDocs": true, + "description": "A component that wraps the header row of a table, which contains the table header components that define the column structure.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -8740,6 +9822,21 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@7952", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8769,7 +9866,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8777,26 +9874,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeaderRow\n extends PreactCustomElement\n implements TableHeaderRowProps\n{\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class TableHeaderRow\n extends PolarisCustomElement\n implements TableHeaderRowProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" } }, "TableRow": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "TableRow", - "description": "The table row component represents a single row of data within a table body. Use table row as a child of table body to structure individual records or entries in the table.\n\nTable row must contain table cell components, with each cell representing a data value for the corresponding column. The number of cells should match the number of headers in the table.", - "isPublicDocs": true, + "description": "A component that represents a single row in a table, which contains the data cells.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "clickDelegate", "value": "string", - "description": "The ID of an interactive element, such as `s-link`, in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally." + "description": "A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@7952", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -8843,7 +9969,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8851,43 +9977,57 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableRow extends PreactCustomElement implements TableRowProps {\n constructor();\n accessor clickDelegate: string;\n}" + "value": "declare class TableRow extends PolarisCustomElement implements TableRowProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /**\n * A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector.\n */\n clickDelegate: string;\n}" } }, "Text": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Text", - "description": "Configure the following properties on the text component.", - "isPublicDocs": true, + "description": "A custom element for displaying inline or small blocks of text with various visual styles and semantic meanings. Use Text to render short pieces of content with appropriate styling, emphasis, and color treatment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color of the text.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", @@ -8902,7 +10042,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -8910,7 +10050,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, { @@ -8918,7 +10058,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The ID of an element this text provides contextual information for." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -8965,7 +10112,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8973,26 +10120,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Text extends PreactCustomElement implements TextProps {\n accessor fontVariantNumeric: TextProps['fontVariantNumeric'];\n accessor color: TextProps['color'];\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: TextProps['tone'];\n /**\n * The semantic type and styling treatment for the text content.\n *\n * - `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n * - `generic`: Standard text with no special semantic meaning or styling.\n * - `address`: Marks the text as contact information, such as a physical or email address.\n * - `redundant`: Indicates the text is redundant or duplicated information for screen reader context.\n */\n accessor type: TextProps['type'];\n accessor dir: TextProps['dir'];\n accessor accessibilityVisibility: TextProps['accessibilityVisibility'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Text extends TextBase implements TextProps {\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: TextProps['tone'];\n constructor();\n}" } }, "TextArea": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "TextArea", - "description": "Configure the following properties on the text area component.", - "isPublicDocs": true, + "description": "The text area custom element class that renders a multi-line text input field in the Shopify admin interface. This component allows merchants to enter and edit longer text content with support for labels, validation, and length constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -9000,7 +10161,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, { @@ -9008,22 +10169,15 @@ "syntaxKind": "PropertyDeclaration", "name": "rows", "value": "number", - "description": "A number of visible text lines.", + "description": "The number of visible text lines for the field, controlling its initial height.", "defaultValue": "2" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -9031,35 +10185,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -9067,14 +10221,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -9082,7 +10236,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -9106,7 +10260,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -9130,7 +10284,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -9138,23 +10292,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@2229", + "name": "__@internals$4@7093", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -9192,7 +10360,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -9200,26 +10368,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextArea\n extends PreactFieldElement\n implements TextAreaProps\n{\n accessor maxLength: TextAreaProps['maxLength'];\n accessor minLength: TextAreaProps['minLength'];\n accessor rows: TextAreaProps['rows'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextArea extends TextAreaBase implements TextAreaProps {\n constructor();\n}" } }, "TextField": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "TextField", - "description": "Configure the following properties on the text field component.", - "isPublicDocs": true, + "description": "The text field custom element class that renders a single-line text input field in the Shopify admin interface. This component allows merchants to enter and edit text with support for labels, validation, icons, and prefix/suffix content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\" | AnyString", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "value": "IconType | AnyString", + "description": "An icon to display at the start of the text field, providing visual context for the input. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", "defaultValue": "''" }, { @@ -9227,7 +10409,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the merchant can enter in the field. When this limit is reached, the field prevents further input.", "defaultValue": "Infinity" }, { @@ -9235,7 +10417,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation. The field will be considered invalid if the merchant enters fewer characters than this value.", "defaultValue": "0" }, { @@ -9243,7 +10425,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the merchant's input, such as a currency symbol (`$`) or protocol (`https://`).", "defaultValue": "''" }, { @@ -9251,22 +10433,15 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the merchant's input, such as a unit of measurement (`kg`, `%`) or domain (`.myshopify.com`).", "defaultValue": "''" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -9274,35 +10449,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -9310,14 +10485,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -9325,7 +10500,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -9349,7 +10524,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -9373,7 +10548,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -9381,23 +10556,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@2229", + "name": "__@internals$4@7093", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -9435,7 +10624,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -9443,43 +10632,64 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextField\n extends PreactFieldElement\n implements TextFieldProps\n{\n accessor icon: TextFieldProps['icon'];\n accessor maxLength: TextFieldProps['maxLength'];\n accessor minLength: TextFieldProps['minLength'];\n accessor prefix: TextFieldProps['prefix'];\n accessor suffix: TextFieldProps['suffix'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextField extends TextFieldBase implements TextFieldProps {\n constructor();\n}" } }, "Thumbnail": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Thumbnail", - "description": "Configure the following properties on the thumbnail component.", - "isPublicDocs": true, + "description": "A thumbnail displays a small preview image with configurable sizing.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display in the thumbnail." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the product thumbnail image.\n\n- `small-200`: Smallest thumbnail size, ideal for compact product lists or tables.\n- `small-100`: Very small thumbnail, suitable for dense layouts.\n- `small`: Small thumbnail for space-constrained contexts.\n- `base`: Default size that balances visibility and space efficiency.\n- `large`: Larger thumbnail for featured products or detailed views.\n- `large-100`: Extra large thumbnail for prominent product display.", + "description": "The size of the thumbnail.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -9525,7 +10735,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -9533,24 +10743,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Thumbnail extends PreactCustomElement implements ThumbnailProps {\n accessor src: ThumbnailProps['src'];\n accessor alt: ThumbnailProps['alt'];\n accessor size: ThumbnailProps['size'];\n constructor();\n}" - } - }, - "Tooltip": { + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Thumbnail extends PolarisCustomElement implements ThumbnailProps {\n /**\n * The URL of the image to display in the thumbnail.\n */\n src: ThumbnailProps['src'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ThumbnailProps['alt'];\n /**\n * The size of the thumbnail.\n */\n size: ThumbnailProps['size'];\n constructor();\n}" + } + }, + "Tooltip": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Tooltip", - "description": "Configure the following properties on the tooltip component.", - "isPublicDocs": true, + "description": "A component that displays a small popup with explanatory text when the user hovers over or focuses on an element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@2598", + "name": "__@overlayHidden@7525", "value": "boolean", "description": "", "isPrivate": true @@ -9558,7 +10782,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@2599", + "name": "__@overlayActivator@7526", "value": "HTMLElement", "description": "", "isPrivate": true @@ -9566,11 +10790,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@2600", + "name": "__@overlayHideFrameId@7527", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -9616,7 +10847,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -9624,8 +10855,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Tooltip extends PreactOverlayElement implements TooltipProps {\n constructor();\n}" @@ -9635,9 +10881,15 @@ "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "UnorderedList", - "description": "Configure the following properties on the unordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a bulleted list of items where the order doesn't matter. Use unordered list when you have a collection of related items without a specific sequence, such as features, options, or bullet points.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -9683,7 +10935,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -9691,34 +10943,48 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class UnorderedList\n extends PreactCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" + "value": "declare class UnorderedList\n extends PolarisCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" } }, "URLField": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "URLField", - "description": "Configure the following properties on the URL field component.", - "isPublicDocs": true, + "description": "The URL field custom element class that renders a URL input field in the Shopify admin interface. This component allows merchants to enter web addresses with automatic URL validation and appropriate mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | `section-${string} url` | `section-${string} photo` | `section-${string} impp` | `section-${string} home impp` | `section-${string} mobile impp` | `section-${string} fax impp` | `section-${string} pager impp` | \"shipping url\" | \"shipping photo\" | \"shipping impp\" | \"shipping home impp\" | \"shipping mobile impp\" | \"shipping fax impp\" | \"shipping pager impp\" | \"billing url\" | \"billing photo\" | \"billing impp\" | \"billing home impp\" | \"billing mobile impp\" | \"billing fax impp\" | \"billing pager impp\" | `section-${string} shipping url` | `section-${string} shipping photo` | `section-${string} shipping impp` | `section-${string} shipping home impp` | `section-${string} shipping mobile impp` | `section-${string} shipping fax impp` | `section-${string} shipping pager impp` | `section-${string} billing url` | `section-${string} billing photo` | `section-${string} billing impp` | `section-${string} billing home impp` | `section-${string} billing mobile impp` | `section-${string} billing fax impp` | `section-${string} billing pager impp` | URLAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint about the intended content of the field for browser autofill.", + "defaultValue": "'url'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the URL.", "defaultValue": "Infinity" }, { @@ -9726,50 +10992,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the URL.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -9777,14 +11036,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -9792,7 +11051,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -9816,7 +11075,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -9840,7 +11099,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -9848,23 +11107,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@2229", + "name": "__@internals$4@7093", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -9902,7 +11175,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -9910,11 +11183,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class URLField\n extends PreactFieldElement\n implements URLFieldProps\n{\n accessor autocomplete: URLFieldProps['autocomplete'];\n accessor maxLength: URLFieldProps['maxLength'];\n accessor minLength: URLFieldProps['minLength'];\n /**\n * The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class URLField extends URLFieldBase implements URLFieldProps {\n constructor();\n}" } }, "URLAutocompleteField": { @@ -9923,32 +11211,37 @@ "syntaxKind": "TypeAliasDeclaration", "name": "URLAutocompleteField", "value": "'url' | 'photo' | 'impp' | 'home impp' | 'mobile impp' | 'fax impp' | 'pager impp'", - "description": "Represents autocomplete values that are valid for URL input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for URL inputs.\n\nAvailable values:\n- `url` - General URL or web address\n- `photo` - URL to a photo or image\n- `impp` - Instant messaging protocol URL\n- `home impp` - Home instant messaging protocol URL\n- `mobile impp` - Mobile instant messaging protocol URL\n- `fax impp` - Fax instant messaging protocol URL\n- `pager impp` - Pager instant messaging protocol URL", - "isPublicDocs": true + "description": "" } }, "AdminAction": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminAction", - "description": "Configure the following properties on the admin action component.", - "isPublicDocs": true, + "description": "The admin action custom element class that renders action controls in the Shopify admin interface. This component creates a standardized action area with a heading and slots for primary and secondary action buttons, used exclusively in admin action extensions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text to use as the Action modal's title. If not provided, the name of the extension will be used." + "description": "The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the action is in a loading state, such as during initial page load or when the action is being opened. When `true`, the action might be in an inert state that prevents user interaction.", + "description": "Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -9994,7 +11287,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -10002,11 +11295,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminAction\n extends PreactCustomElement\n implements AdminActionProps\n{\n /**\n * The text to use as the Action modal's title. If not provided, the name of the extension will be used.\n */\n heading: string;\n /**\n * Whether the action is in a loading state, such as during initial page load or when the action is being opened.\n * When `true`, the action might be in an inert state that prevents user interaction.\n */\n loading: boolean;\n constructor();\n}" + "value": "declare class AdminAction\n extends PolarisCustomElement\n implements AdminActionProps\n{\n /**\n * The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading.\n */\n heading: string;\n /**\n * Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.\n *\n * @default false\n */\n loading: boolean;\n constructor();\n}" } }, "RunnableExtension": { @@ -10233,22 +11541,28 @@ "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminBlock", - "description": "Configure the following properties on the admin block component.", - "isPublicDocs": true, + "description": "The admin block custom element class that renders a collapsible content block in the Shopify admin interface. This component organizes content into expandable sections with headings and provides a summary when collapsed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text displayed as the block's title in the header. If not provided, the extension name will be used." + "description": "The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "collapsedSummary", "value": "string", - "description": "The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated." + "description": "The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -10295,7 +11609,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -10303,20 +11617,41 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminBlock\n extends PreactCustomElement\n implements AdminBlockProps\n{\n /**\n * The text displayed as the block's title in the header. If not provided, the extension name will be used.\n */\n heading: string;\n /**\n * The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated.\n */\n collapsedSummary: string;\n constructor();\n}" + "value": "declare class AdminBlock\n extends PolarisCustomElement\n implements AdminBlockProps\n{\n /**\n * The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed.\n */\n heading: string;\n /**\n * The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed.\n */\n collapsedSummary: string;\n constructor();\n}" } }, "Form": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Form", - "description": "Configure the following properties on the form component.", - "isPublicDocs": true, + "description": "The form custom element class that renders a form container in the Shopify admin interface. This component manages form submission, validation, and reset behavior for collecting merchant input.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -10362,7 +11697,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -10370,11 +11705,120 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Form extends PolarisCustomElement implements FormProps {\n constructor();\n}" + } + }, + "IntentRenderApi": { + "src/surfaces/admin/api/intents/intent-render.ts": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderApi", + "description": "The `IntentRenderApi` object provides methods for extensions that render in response to an app intent. Access the intent data to determine what action the merchant requested and use `intents.response` to resolve the intent when complete.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "auth", + "value": "Auth", + "description": "Provides methods for authenticating calls to your app backend. Use the `idToken()` method to retrieve a signed JWT token that verifies the current user's identity for secure server-side operations." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "extension", + "value": "{ target: ExtensionTarget; }", + "description": "The identifier of the running extension target. Use this to determine which target your extension is rendering in and conditionally adjust functionality or UI based on the extension context." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "i18n", + "value": "I18n", + "description": "Utilities for translating content according to the current localization of the admin. Use these methods to provide translated strings that match the merchant's language preferences, ensuring your extension is accessible to a global audience." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "intents", + "value": "IntentRenderIntents", + "description": "Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "picker", + "value": "PickerApi", + "description": "Opens a custom selection dialog with your app-specific data. Use the [Picker API](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/picker-api) to define the picker's heading, items, headers, and selection behavior. Returns a Promise that resolves to a `Picker` object with a `selected` property for accessing the merchant's selection." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "query", + "value": "(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>", + "description": "Executes GraphQL queries against the [GraphQL Admin API](/docs/api/admin-graphql). Use this to fetch shop data, manage resources, or perform mutations. Queries are automatically authenticated with the current user's permissions. Optionally specify GraphQL variables and API version for your query." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "resourcePicker", + "value": "ResourcePickerApi", + "description": "Opens the [resource picker](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/resource-picker-api) modal for selecting products, variants, or collections. Returns the selected resources when the user confirms their selection, or undefined if they cancel." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "storage", + "value": "Storage", + "description": "Provides methods for persisting data in browser storage that is scoped to your extension. Use this to store user preferences, cache data, maintain state across sessions, or save temporary working data. Storage is persistent across page reloads and isolated per extension." + } + ], + "value": "export interface IntentRenderApi\n extends StandardRenderingExtensionApi {\n /**\n * Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow.\n */\n intents: IntentRenderIntents;\n}" + } + }, + "IntentRenderIntents": { + "src/surfaces/admin/api/intents/intent-render.ts": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderIntents", + "description": "The intents API available to intent render extensions. Unlike other targets where `response` is optional, intent render extensions always run inside an intent workflow so `response` is guaranteed.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled." } ], - "value": "declare class Form extends PreactCustomElement implements FormProps {\n constructor();\n}" + "value": "export interface IntentRenderIntents {\n /**\n * Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled.\n */\n response: IntentResponseApi;\n}" + } + }, + "FormExtensionComponents": { + "src/surfaces/admin/components/FormExtensionComponents.ts": { + "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "FormExtensionComponents", + "value": "StandardComponents | 'Form'", + "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." } }, "StandardApi": { @@ -11040,22 +12484,19 @@ "description": "The components available for building function settings extensions. Includes all form components plus the function settings component required for function settings configuration." } }, - "FormExtensionComponents": { - "src/surfaces/admin/components/FormExtensionComponents.ts": { - "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "FormExtensionComponents", - "value": "StandardComponents | 'Form'", - "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." - } - }, "FunctionSettings": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "FunctionSettings", - "description": "Configure the following properties on the function settings component.", - "isPublicDocs": true, + "description": "The function settings custom element class that renders a specialized form for configuring Shopify Function settings in the admin interface. This component manages function configuration submission, validation, and error handling.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -11101,7 +12542,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -11109,8 +12550,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class FunctionSettings\n extends PreactCustomElement\n implements FunctionSettingsProps\n{\n constructor();\n}" @@ -11203,15 +12659,21 @@ "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminPrintAction", - "description": "Configure the following properties on the admin print action component.", - "isPublicDocs": true, + "description": "The admin print action custom element class that renders a print interface in the Shopify admin. This component enables merchants to print content from a specified source URL using the browser's print functionality.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The `src` URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs, and images are supported." + "description": "The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -11258,7 +12720,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -11266,11 +12728,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminPrintAction\n extends PreactCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The `src` URL of the preview and the document to print.\n * If not provided, the preview will show an empty state and the print button will be disabled.\n * HTML, PDFs, and images are supported.\n */\n src: string;\n constructor();\n}" + "value": "declare class AdminPrintAction\n extends PolarisCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action.\n */\n src: string;\n constructor();\n}" } }, "ProductDetailsConfigurationApi": { @@ -12160,7 +13637,7 @@ "filePath": "src/surfaces/admin/api/intents/intents.ts", "syntaxKind": "PropertySignature", "name": "issues", - "value": "{ path?: string[]; message?: string; code?: string; }[]", + "value": "Issue[]", "description": "Specific validation issues or field errors. Present when validation fails on particular fields, allowing you to show targeted error messages.", "isOptional": true }, @@ -12173,7 +13650,7 @@ "isOptional": true } ], - "value": "export interface ErrorIntentResponse {\n /** Indicates the workflow failed. When `'error'`, the workflow encountered validation errors or other issues that prevented completion. */\n code?: 'error';\n /** A general error message describing what went wrong. Use this to display feedback when specific field errors aren't available. */\n message?: string;\n /** Specific validation issues or field errors. Present when validation fails on particular fields, allowing you to show targeted error messages. */\n issues?: {\n /** The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure. */\n path?: string[];\n /** A description of what's wrong with this field. Display this to help merchants understand how to fix the error. */\n message?: string;\n /** A machine-readable error code for this issue. Use this for programmatic error handling or logging. */\n code?: string;\n }[];\n}" + "value": "export interface ErrorIntentResponse {\n /** Indicates the workflow failed. When `'error'`, the workflow encountered validation errors or other issues that prevented completion. */\n code?: 'error';\n /** A general error message describing what went wrong. Use this to display feedback when specific field errors aren't available. */\n message?: string;\n /** Specific validation issues or field errors. Present when validation fails on particular fields, allowing you to show targeted error messages. */\n issues?: Issue[];\n}" } }, "IntentResponse": { @@ -12518,8 +13995,7 @@ "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Page", - "description": "Use as the outer wrapper of a page.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -12552,6 +14028,13 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -12581,7 +14064,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -12589,17 +14072,32 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Page extends PreactCustomElement implements PageProps {\n accessor inlineSize: PageProps['inlineSize'];\n accessor heading: PageProps['heading'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" - } - }, - "IntentQueryOptions": { - "src/surfaces/admin/api/intents/intents.ts": { - "filePath": "src/surfaces/admin/api/intents/intents.ts", - "name": "IntentQueryOptions", + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@6491", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@6492", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Page extends PageBase implements PageProps {\n constructor();\n}" + } + }, + "IntentQueryOptions": { + "src/surfaces/admin/api/intents/intents.ts": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "IntentQueryOptions", "description": "Additional parameters for intent invocation when using the string query format. Use these options to provide resource IDs for editing or pass required context data for resource creation.", "isPublicDocs": true, "members": [ @@ -12948,677 +14446,778 @@ "value": "export interface OrderRoutingRule {\n /** The display label for the order routing rule shown to merchants in the admin. Use this to identify the rule in lists and settings pages. */\n label: string;\n /** A description explaining the rule's purpose and how it routes orders. Use this to help merchants understand what the rule does. */\n description: string;\n /** The unique global identifier (GID) for the order routing rule. Use this ID to associate configuration changes with the correct rule. */\n id: string;\n /** The priority order for rule evaluation when multiple rules exist. Lower numbers are evaluated first (for example, a rule with priority 1 runs before priority 2). Use this to understand the rule's position in the evaluation sequence. */\n priority?: number;\n /** An array of [metafields](/docs/apps/build/metafields) that store the routing rule's configuration values. Use these metafields to populate your settings UI with the current rule configuration. */\n metafields: Metafield[];\n}" } }, - "ComponentChildren": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ComponentChildren", - "value": "preact.ComponentChildren", - "description": "Represents any valid children that can be rendered within a component, including elements, strings, numbers, or arrays of these types. This is an alias for Preact's `ComponentChildren` type.", - "isPublicDocs": true - } - }, - "StringChildren": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "StringChildren", - "value": "string", - "description": "Represents string-only children for components that specifically require text content.", - "isPublicDocs": true - } - }, - "ActionProps": { + "AvatarProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ActionProps", - "description": "", + "name": "AvatarProps", + "description": "The properties for the avatar component. An avatar displays a user or entity image with fallback initials when the image isn't available. Properties include `src` for the image URL, `initials` for the fallback text, `alt` for accessibility text, and `size` for controlling the avatar dimensions.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "heading", + "name": "alt", "value": "string", - "description": "The text to use as the action modal's title. If not provided, the name of the extension will be used.", - "isOptional": true - } - ], - "value": "export interface ActionProps {\n /**\n * The text to use as the action modal's title. If not provided, the name of the extension will be used.\n */\n heading?: string;\n}" - } - }, - "ActionSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ActionSlots", - "description": "The action component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "description": "Alternative text that describes the avatar for screen readers. This text should identify who or what the avatar represents." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "primaryAction", - "value": "ComponentChildren", - "description": "The primary action button or link, representing the main or most important action available in this context. Typically displayed with higher visual prominence than secondary actions to establish clear hierarchy.", - "isOptional": true + "name": "initials", + "value": "string", + "description": "The initials to display when no image is provided or if the image fails to load. This typically includes the first letter of a user's first and last name (for example, `'JD'` for John Doe)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondaryActions", - "value": "ComponentChildren", - "description": "Additional action buttons or links that provide alternative or supporting actions. Visually de-emphasized compared to the primary action.", - "isOptional": true + "name": "size", + "value": "'small' | 'small-200' | 'base' | 'large' | 'large-200'", + "description": "The size of the avatar. Choose from `'small-200'`, `'small'`, `'base'`, `'large'`, or `'large-200'` to control the avatar dimensions.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "src", + "value": "string", + "description": "The URL of the avatar image to display. You can provide an absolute or relative URL pointing to the image file." } ], - "value": "export interface ActionSlots {\n /**\n * The primary action button or link, representing the main or most important action available in this context.\n * Typically displayed with higher visual prominence than secondary actions to establish clear hierarchy.\n */\n primaryAction?: ComponentChildren;\n /**\n * Additional action buttons or links that provide alternative or supporting actions.\n * Visually de-emphasized compared to the primary action.\n */\n secondaryActions?: ComponentChildren;\n}" + "value": "export interface AvatarProps\n extends Required> {\n /**\n * The initials to display when no image is provided or if the image fails to load. This typically includes the first letter of a user's first and last name (for example, `'JD'` for John Doe).\n */\n initials: RequiredAvatarProps['initials'];\n /**\n * The URL of the avatar image to display. You can provide an absolute or relative URL pointing to the image file.\n */\n src: RequiredAvatarProps['src'];\n /**\n * Alternative text that describes the avatar for screen readers. This text should identify who or what the avatar represents.\n */\n alt: RequiredAvatarProps['alt'];\n /**\n * The size of the avatar. Choose from `'small-200'`, `'small'`, `'base'`, `'large'`, or `'large-200'` to control the avatar dimensions.\n *\n * @default 'base'\n */\n size: Extract<\n AvatarProps$1['size'],\n 'small-200' | 'small' | 'base' | 'large' | 'large-200'\n >;\n}" } }, - "BaseOverlayProps": { + "ReactProps$$": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseOverlayProps", - "description": "", + "name": "ReactProps$$", + "description": "The properties for the avatar component when it's used in JSX.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onAfterHide", - "value": "(event: Event) => void", - "description": "A callback fired when the overlay is hidden, after any hide animations have completed.", - "isOptional": true + "name": "alt", + "value": "string", + "description": "Alternative text that describes the avatar for screen readers. This text should identify who or what the avatar represents." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onAfterShow", - "value": "(event: Event) => void", - "description": "A callback fired when the overlay is shown, after any show animations have completed.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onHide", - "value": "(event: Event) => void", - "description": "A callback fired immediately after the overlay is hidden.", + "name": "initials", + "value": "string", + "description": "The initials to display when no image is provided or if the image fails to load. This typically includes the first letter of a user's first and last name (for example, `'JD'` for John Doe)." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onError", + "value": "() => void", + "description": "A callback that's fired when the avatar image fails to load.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onShow", - "value": "(event: Event) => void", - "description": "A callback fired immediately after the overlay is shown.", + "name": "onLoad", + "value": "() => void", + "description": "A callback that's fired when the avatar image has loaded successfully.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "size", + "value": "'small' | 'small-200' | 'base' | 'large' | 'large-200'", + "description": "The size of the avatar. Choose from `'small-200'`, `'small'`, `'base'`, `'large'`, or `'large-200'` to control the avatar dimensions.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "src", + "value": "string", + "description": "The URL of the avatar image to display. You can provide an absolute or relative URL pointing to the image file." } ], - "value": "export interface BaseOverlayProps {\n /**\n * A callback fired immediately after the overlay is shown.\n */\n onShow?: (event: Event) => void;\n /**\n * A callback fired when the overlay is shown, after any show animations have completed.\n */\n onAfterShow?: (event: Event) => void;\n /**\n * A callback fired immediately after the overlay is hidden.\n */\n onHide?: (event: Event) => void;\n /**\n * A callback fired when the overlay is hidden, after any hide animations have completed.\n */\n onAfterHide?: (event: Event) => void;\n}" + "value": "export interface ReactProps$$\n extends Partial,\n Pick {\n /**\n * A callback that's fired when the avatar image has loaded successfully.\n */\n onLoad?: () => void;\n /**\n * A callback that's fired when the avatar image fails to load.\n */\n onError?: () => void;\n}" } }, - "BaseOverlayMethods": { + "BadgeProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseOverlayMethods", - "description": "Shared interface for web component methods that control overlay visibility.\n\nAll methods are required (not optional) because components implementing this interface must provide consistent JavaScript APIs. Unlike props/attributes, methods are not rendered in HTML and consumers expect them to be available on all component instances.", + "name": "BadgeProps", + "description": "The properties for the badge component. Badges display status information through compact visual indicators with customizable tones, sizes, and optional icons.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "hideOverlay", - "value": "() => void", - "description": "A method to programmatically hide the overlay." + "name": "color", + "value": "'base' | 'strong'", + "description": "Controls the visual weight and emphasis of the badge. Available options:\n- `'base'` - Standard weight with moderate emphasis, suitable for most use cases.\n- `'strong'` - Increased visual weight for higher emphasis and prominence.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "showOverlay", - "value": "() => void", - "description": "A method to programmatically show the overlay." + "name": "icon", + "value": "IconProps['type'] | ''", + "description": "The icon to display inside the badge. Accepts any valid icon type or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "toggleOverlay", - "value": "() => void", - "description": "A method to programmatically toggle the visibility of the overlay." + "name": "size", + "value": "'base' | 'large' | 'large-100'", + "description": "Determines the size of the badge. Available options:\n- `'base'` - Standard size for most use cases.\n- `'large'` - Larger size for increased visibility and prominence.\n- `'large-100'` - Extra large size for maximum visibility in specific contexts.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto' | 'neutral' | 'caution'", + "description": "Determines the visual appearance and semantic meaning of the badge. Badges rely on the tone system for semantic meaning, so using custom styling might not clearly convey meaning to merchants. Available options:\n- `'auto'` - Lets the system automatically choose the appropriate tone based on context.\n- `'neutral'` - Gray styling for general status information that doesn't require emphasis.\n- `'info'` - Blue styling for informational content and neutral updates.\n- `'success'` - Green styling for positive states, completed actions, and successful operations.\n- `'caution'` - Yellow styling for situations that need attention but aren't urgent.\n- `'warning'` - Orange styling for important notices that require merchant awareness.\n- `'critical'` - Red styling for errors, failures, and urgent issues requiring immediate action.", + "defaultValue": "'auto'" } ], - "value": "export interface BaseOverlayMethods {\n /**\n * A method to programmatically show the overlay.\n *\n * @implementation This is a method to be called on the element and not a callback and should hence be camelCase\n */\n showOverlay: () => void;\n /**\n * A method to programmatically hide the overlay.\n *\n * @implementation This is a method to be called on the element and not a callback and should hence be camelCase\n */\n hideOverlay: () => void;\n /**\n * A method to programmatically toggle the visibility of the overlay.\n *\n * @implementation This is a method to be called on the element and not a callback and should hence be camelCase\n */\n toggleOverlay: () => void;\n}" + "value": "export interface BadgeProps\n extends Pick {\n /**\n * Controls the visual weight and emphasis of the badge. Available options:\n * - `'base'` - Standard weight with moderate emphasis, suitable for most use cases.\n * - `'strong'` - Increased visual weight for higher emphasis and prominence.\n *\n * @default 'base'\n */\n color: Extract;\n /**\n * The icon to display inside the badge. Accepts any valid icon type or an empty string to display no icon.\n *\n * @default ''\n */\n icon: IconProps['type'] | '';\n /**\n * Determines the size of the badge. Available options:\n * - `'base'` - Standard size for most use cases.\n * - `'large'` - Larger size for increased visibility and prominence.\n * - `'large-100'` - Extra large size for maximum visibility in specific contexts.\n *\n * @default 'base'\n */\n size: Extract;\n /**\n * Determines the visual appearance and semantic meaning of the badge. Badges rely on the tone system for semantic meaning, so using custom styling might not clearly convey meaning to merchants. Available options:\n * - `'auto'` - Lets the system automatically choose the appropriate tone based on context.\n * - `'neutral'` - Gray styling for general status information that doesn't require emphasis.\n * - `'info'` - Blue styling for informational content and neutral updates.\n * - `'success'` - Green styling for positive states, completed actions, and successful operations.\n * - `'caution'` - Yellow styling for situations that need attention but aren't urgent.\n * - `'warning'` - Orange styling for important notices that require merchant awareness.\n * - `'critical'` - Red styling for errors, failures, and urgent issues requiring immediate action.\n *\n * @default 'auto'\n */\n tone: Extract<\n BadgeProps$1['tone'],\n 'auto' | 'neutral' | 'info' | 'success' | 'caution' | 'warning' | 'critical'\n >;\n}" } }, - "FocusEventProps": { + "IconProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "FocusEventProps", + "name": "IconProps", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onBlur", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", - "isOptional": true + "name": "color", + "value": "'base' | 'subdued'", + "description": "The color emphasis of the icon. Use `'base'` for the standard color intensity, or `'subdued'` for a lighter, less prominent appearance.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onFocus", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "size", + "value": "'small' | 'base'", + "description": "The size of the icon. Use `'small'` for compact layouts, or `'base'` for standard sizing.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto' | 'neutral' | 'caution'", + "description": "The color tone of the icon based on its semantic meaning. Choose from `'auto'` to let the icon inherit its context, `'neutral'` for standard icons, `'info'` for informational content, `'success'` for positive actions, `'caution'` or `'warning'` for warnings, or `'critical'` for errors.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "type", + "value": "'' | IconType | 'empty'", + "description": "The type of icon that will be displayed. You can specify an icon name from the available icon set, or use an empty string to show no icon." } ], - "value": "export interface FocusEventProps {\n /**\n * A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n onBlur?: (event: FocusEvent) => void;\n /**\n * A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n onFocus?: (event: FocusEvent) => void;\n}" + "value": "export interface IconProps\n extends Required<\n Pick\n > {\n /**\n * The type of icon that will be displayed. You can specify an icon name from the available icon set, or use an empty string to show no icon.\n */\n type: '' | IconType | 'empty';\n /**\n * The color tone of the icon based on its semantic meaning. Choose from `'auto'` to let the icon inherit its context, `'neutral'` for standard icons, `'info'` for informational content, `'success'` for positive actions, `'caution'` or `'warning'` for warnings, or `'critical'` for errors.\n *\n * @default 'auto'\n */\n tone: Extract<\n IconProps$1['tone'],\n 'auto' | 'neutral' | 'info' | 'success' | 'caution' | 'warning' | 'critical'\n >;\n /**\n * The color emphasis of the icon. Use `'base'` for the standard color intensity, or `'subdued'` for a lighter, less prominent appearance.\n *\n * @default 'base'\n */\n color: Extract;\n /**\n * The size of the icon. Use `'small'` for compact layouts, or `'base'` for standard sizing.\n *\n * @default 'base'\n */\n size: Extract;\n}" } }, - "ToggleEventProps": { + "ReactProps$_": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ToggleEventProps", - "description": "", + "name": "ReactProps$_", + "description": "The JSX props for the badge component. These properties extend `BadgeProps` with an optional `id` and `children` for rendering badge content in JSX.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onAfterToggle", - "value": "(event: ToggleEvent$1) => void", - "description": "A callback fired when the element state changes, after any toggle animations have finished.\n\n- If the element transitioned from hidden to showing, the `oldState` property will be set to `closed` and the `newState` property will be set to `open`.\n- If the element transitioned from showing to hidden, the `oldState` property will be set to `open` and the `newState` will be `closed`.\n\nLearn more about [ToggleEvent.newState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/newState) and [ToggleEvent.oldState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/oldState).", + "name": "children", + "value": "ComponentChildren", + "description": "The text content to display inside the badge. Typically a short status label like \"Fulfilled\", \"Draft\", or \"Active\".", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onToggle", - "value": "(event: ToggleEvent$1) => void", - "description": "A callback fired immediately when the element state changes, before any animations.\n\n- If the element is transitioning from hidden to showing, the `oldState` property will be set to `closed` and the `newState` property will be set to `open`.\n- If the element is transitioning from showing to hidden, then `oldState` property will be set to `open` and the `newState` will be `closed`.\n\nLearn more about the [toggle event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event), [ToggleEvent.newState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/newState), and [ToggleEvent.oldState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/oldState).", + "name": "color", + "value": "'base' | 'strong'", + "description": "Controls the visual weight and emphasis of the badge. Available options:\n- `'base'` - Standard weight with moderate emphasis, suitable for most use cases.\n- `'strong'` - Increased visual weight for higher emphasis and prominence.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "icon", + "value": "IconProps['type'] | ''", + "description": "The icon to display inside the badge. Accepts any valid icon type or an empty string to display no icon.", + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "size", + "value": "'base' | 'large' | 'large-100'", + "description": "Determines the size of the badge. Available options:\n- `'base'` - Standard size for most use cases.\n- `'large'` - Larger size for increased visibility and prominence.\n- `'large-100'` - Extra large size for maximum visibility in specific contexts.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto' | 'neutral' | 'caution'", + "description": "Determines the visual appearance and semantic meaning of the badge. Badges rely on the tone system for semantic meaning, so using custom styling might not clearly convey meaning to merchants. Available options:\n- `'auto'` - Lets the system automatically choose the appropriate tone based on context.\n- `'neutral'` - Gray styling for general status information that doesn't require emphasis.\n- `'info'` - Blue styling for informational content and neutral updates.\n- `'success'` - Green styling for positive states, completed actions, and successful operations.\n- `'caution'` - Yellow styling for situations that need attention but aren't urgent.\n- `'warning'` - Orange styling for important notices that require merchant awareness.\n- `'critical'` - Red styling for errors, failures, and urgent issues requiring immediate action.", + "defaultValue": "'auto'" } ], - "value": "export interface ToggleEventProps {\n /**\n * A callback fired when the element state changes, after any toggle animations have finished.\n *\n * - If the element transitioned from hidden to showing, the `oldState` property will be set to `closed` and the\n * `newState` property will be set to `open`.\n * - If the element transitioned from showing to hidden, the `oldState` property will be set to `open` and the\n * `newState` will be `closed`.\n *\n * Learn more about [ToggleEvent.newState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/newState) and [ToggleEvent.oldState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/oldState).\n */\n onAfterToggle?: (event: ToggleEvent$1) => void;\n /**\n * A callback fired immediately when the element state changes, before any animations.\n *\n * - If the element is transitioning from hidden to showing, the `oldState` property will be set to `closed` and the\n * `newState` property will be set to `open`.\n * - If the element is transitioning from showing to hidden, then `oldState` property will be set to `open` and the\n * `newState` will be `closed`.\n *\n * Learn more about the [toggle event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event), [ToggleEvent.newState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/newState), and [ToggleEvent.oldState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/oldState).\n */\n onToggle?: (event: ToggleEvent$1) => void;\n}" + "value": "export interface ReactProps$_\n extends Partial,\n Pick {\n /**\n * The text content to display inside the badge. Typically a short status label like \"Fulfilled\", \"Draft\", or \"Active\".\n */\n children?: ComponentChildren;\n}" } }, - "ToggleState": { + "ComponentChildren": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", - "name": "ToggleState", - "value": "'open' | 'closed'", - "description": "Represents the visibility state of a toggleable element.\n\n- `open`: The element is visible or expanded.\n- `closed`: The element is hidden or collapsed.", - "isPublicDocs": true + "name": "ComponentChildren", + "value": "preact.ComponentChildren", + "description": "" } }, - "ExtendableEvent": { + "RequiredBannerProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ExtendableEvent", - "description": "", + "syntaxKind": "TypeAliasDeclaration", + "name": "RequiredBannerProps", + "value": "Required", + "description": "All properties for the banner component marked as required.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "AT_TARGET", - "value": "2", - "description": "" + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Banner.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "bubbles", + "name": "collapsible", "value": "boolean", - "description": "The **`bubbles`** read-only property of the Event interface indicates whether the event bubbles up through the DOM tree or not.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/bubbles)" + "description": "Makes the content collapsible. A collapsible banner will conceal child elements initially, but allow the user to expand the banner to see them.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "BUBBLING_PHASE", - "value": "3", - "description": "" + "name": "dismissible", + "value": "boolean", + "description": "Determines whether the close button of the banner is present.\n\nWhen the close button is pressed, the `dismiss` event will fire, then `hidden` will be true, any animation will complete, and the `afterhide` event will fire.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "cancelable", - "value": "boolean", - "description": "The **`cancelable`** read-only property of the Event interface indicates whether the event can be canceled, and therefore prevented as if the event never happened.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelable)" + "name": "heading", + "value": "string", + "description": "The title of the banner.", + "isOptional": true, + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "cancelBubble", + "name": "hidden", "value": "boolean", - "description": "The **`cancelBubble`** property of the Event interface is deprecated.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelBubble)" + "description": "Determines whether the banner is hidden.\n\nIf this property is being set on each framework render (as in 'controlled' usage), and the banner is `dismissible`, ensure you update app state for this property when the `dismiss` event fires.\n\nIf the banner is not `dismissible`, it can still be hidden by setting this property.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "CAPTURING_PHASE", - "value": "1", - "description": "" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "composed", - "value": "boolean", - "description": "The read-only **`composed`** property of the or not the event will propagate across the shadow DOM boundary into the standard DOM.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composed)" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "composedPath", - "value": "() => EventTarget[]", - "description": "The **`composedPath()`** method of the Event interface returns the event's path which is an array of the objects on which listeners will be invoked.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composedPath)" + "name": "onAfterHide", + "value": "(event: Event) => void", + "description": "Event handler when the banner has fully hidden.\n\nThe `hidden` property will be `true` when this event fires.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "currentTarget", - "value": "EventTarget | null", - "description": "The **`currentTarget`** read-only property of the Event interface identifies the element to which the event handler has been attached.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/currentTarget)" + "name": "onDismiss", + "value": "(event: Event) => void", + "description": "Event handler when the banner is dismissed by the user.\n\nThis does not fire when setting `hidden` manually.\n\nThe `hidden` property will be `false` when this event fires.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultPrevented", - "value": "boolean", - "description": "The **`defaultPrevented`** read-only property of the Event interface returns a boolean value indicating whether or not the call to Event.preventDefault() canceled the event.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/defaultPrevented)" + "name": "primaryAction", + "value": "ComponentChildren", + "description": "The primary action to perform, provided as a button or link type element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "eventPhase", - "value": "number", - "description": "The **`eventPhase`** read-only property of the being evaluated.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/eventPhase)" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "initEvent", - "value": "(type: string, bubbles?: boolean, cancelable?: boolean) => void", - "description": "The **`Event.initEvent()`** method is used to initialize the value of an event created using Document.createEvent().", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/initEvent)" + "name": "secondaryActions", + "value": "ComponentChildren", + "description": "The secondary actions to perform, provided as button or link type elements.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "isTrusted", - "value": "boolean", - "description": "The **`isTrusted`** read-only property of the when the event was generated by the user agent (including via user actions and programmatic methods such as HTMLElement.focus()), and `false` when the event was dispatched via The only exception is the `click` event, which initializes the `isTrusted` property to `false` in user agents.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/isTrusted)" - }, + "name": "tone", + "value": "ToneKeyword", + "description": "Sets the tone of the Banner, based on the intention of the information being conveyed.\n\nThe banner is a live region and the type of status will be dictated by the Tone selected.\n\n- `critical` creates an [assertive live region](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/alert_role) that is announced by screen readers immediately.\n- `neutral`, `info`, `success`, `warning` and `caution` creates an [informative live region](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/status_role) that is announced by screen readers after the current message.", + "isOptional": true, + "defaultValue": "'auto'" + } + ] + } + }, + "ToneKeyword": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "ToneKeyword", + "value": "'auto' | 'neutral' | 'info' | 'success' | 'caution' | 'warning' | 'critical' | 'accent' | 'custom'", + "description": "Tone is a property for defining the color treatment of a component.\n\nA tone can apply a grouping of colors to a component. For example, critical may have a specific text color and background color.\n\nIn some cases, like for Banner, the tone may also affect the semantic and accessibility treatment of the component." + } + }, + "BannerProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "BannerProps", + "description": "The properties for the banner component. These properties define an important message or notification with visual styling that conveys its semantic meaning.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "NONE", - "value": "0", - "description": "" + "name": "dismissible", + "value": "boolean", + "description": "Determines whether the close button of the banner is present.\n\nWhen the close button is pressed, the `dismiss` event will fire, then `hidden` will be true, any animation will complete, and the `afterhide` event will fire.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "preventDefault", - "value": "() => void", - "description": "The **`preventDefault()`** method of the Event interface tells the user agent that if the event does not get explicitly handled, its default action should not be taken as it normally would be.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/preventDefault)" + "syntaxKind": "PropertySignature", + "name": "heading", + "value": "string", + "description": "The title of the banner.", + "isOptional": true, + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "returnValue", + "name": "hidden", "value": "boolean", - "description": "The Event property **`returnValue`** indicates whether the default action for this event has been prevented or not.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/returnValue)" + "description": "Determines whether the banner is hidden.\n\nIf this property is being set on each framework render (as in 'controlled' usage), and the banner is `dismissible`, ensure you update app state for this property when the `dismiss` event fires.\n\nIf the banner is not `dismissible`, it can still be hidden by setting this property.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "srcElement", - "value": "EventTarget | null", - "description": "The deprecated **`Event.srcElement`** is an alias for the Event.target property.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/srcElement)" - }, + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto'", + "description": "The color tone of the banner based on its semantic meaning.", + "defaultValue": "'auto'" + } + ], + "value": "export interface BannerProps\n extends Pick<\n RequiredBannerProps,\n 'heading' | 'dismissible' | 'hidden' | 'tone'\n > {\n /**\n * The color tone of the banner based on its semantic meaning.\n *\n * @default 'auto'\n */\n tone: Extract<\n RequiredBannerProps['tone'],\n 'auto' | 'critical' | 'warning' | 'success' | 'info'\n >;\n}" + } + }, + "BannerJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "BannerJSXProps", + "description": "The JSX properties for the banner component. These properties define how a banner is rendered in Preact or JSX.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "stopImmediatePropagation", - "value": "() => void", - "description": "The **`stopImmediatePropagation()`** method of the If several listeners are attached to the same element for the same event type, they are called in the order in which they were added.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopImmediatePropagation)" + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the banner.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "stopPropagation", - "value": "() => void", - "description": "The **`stopPropagation()`** method of the Event interface prevents further propagation of the current event in the capturing and bubbling phases.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopPropagation)" + "syntaxKind": "PropertySignature", + "name": "dismissible", + "value": "boolean", + "description": "Determines whether the close button of the banner is present.\n\nWhen the close button is pressed, the `dismiss` event will fire, then `hidden` will be true, any animation will complete, and the `afterhide` event will fire.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "target", - "value": "EventTarget | null", - "description": "The read-only **`target`** property of the dispatched.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/target)" + "name": "heading", + "value": "string", + "description": "The title of the banner.", + "isOptional": true, + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "timeStamp", - "value": "DOMHighResTimeStamp", - "description": "The **`timeStamp`** read-only property of the Event interface returns the time (in milliseconds) at which the event was created.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/timeStamp)" + "name": "hidden", + "value": "boolean", + "description": "Determines whether the banner is hidden.\n\nIf this property is being set on each framework render (as in 'controlled' usage), and the banner is `dismissible`, ensure you update app state for this property when the `dismiss` event fires.\n\nIf the banner is not `dismissible`, it can still be hidden by setting this property.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "type", + "name": "id", "value": "string", - "description": "The **`type`** read-only property of the Event interface returns a string containing the event's type.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/type)" + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "waitUntil", - "value": "(promise: Promise) => void", - "description": "A method that accepts a promise signaling the duration and eventual success or failure of event-related actions.\n\nCan be called multiple times to add promises to the event, but must be called synchronously during event dispatch. Cannot be called after a `setTimeout` or within a microtask.", + "name": "onAfterHide", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired after the banner finishes hiding.", "isOptional": true - } - ], - "value": "export interface ExtendableEvent extends Event {\n /**\n * A method that accepts a promise signaling the duration and eventual success or failure of event-related actions.\n *\n * Can be called multiple times to add promises to the event, but must be called synchronously during event dispatch.\n * Cannot be called after a `setTimeout` or within a microtask.\n */\n waitUntil?: (promise: Promise) => void;\n}" - } - }, - "AggregateError": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AggregateError", - "description": "", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "errors", - "value": "T[]", - "description": "An array of individual errors that have been aggregated together. Each error in this array represents a separate failure that occurred." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "message", - "value": "string", - "description": "" + "name": "onDismiss", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired when the banner is dismissed.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "name", - "value": "string", - "description": "" + "name": "secondaryActions", + "value": "ComponentChildren", + "description": "The secondary actions to display at the bottom of the banner. Only buttons with the `variant` of `'secondary'` or `'auto'` are allowed. A maximum of two `s-button` components can be provided.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "stack", - "value": "string", - "description": "", - "isOptional": true + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto'", + "description": "The color tone of the banner based on its semantic meaning.", + "defaultValue": "'auto'" } ], - "value": "export interface AggregateError extends Error {\n /**\n * An array of individual errors that have been aggregated together.\n * Each error in this array represents a separate failure that occurred.\n */\n errors: T[];\n}" + "value": "export interface BannerJSXProps\n extends Partial,\n Pick {\n /**\n * The content of the banner.\n */\n children?: ComponentChildren;\n /**\n * The secondary actions to display at the bottom of the banner. Only buttons with the `variant` of `'secondary'` or `'auto'` are allowed. A maximum of two `s-button` components can be provided.\n */\n secondaryActions?: ComponentChildren;\n /**\n * A callback that's fired when the banner is dismissed.\n */\n onDismiss?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's fired after the banner finishes hiding.\n */\n onAfterHide?: ((event: CallbackEvent) => void) | null;\n}" } }, - "AggregateErrorEvent": { + "RequiredBoxProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "AggregateErrorEvent", - "description": "", + "syntaxKind": "TypeAliasDeclaration", + "name": "RequiredBoxProps", + "value": "Required", + "description": "A version of the box properties with all fields required.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "AT_TARGET", - "value": "2", - "description": "" + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "bubbles", - "value": "boolean", - "description": "The **`bubbles`** read-only property of the Event interface indicates whether the event bubbles up through the DOM tree or not.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/bubbles)" + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "BUBBLING_PHASE", - "value": "3", - "description": "" + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "cancelable", - "value": "boolean", - "description": "The **`cancelable`** read-only property of the Event interface indicates whether the event can be canceled, and therefore prevented as if the event never happened.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelable)" + "name": "background", + "value": "BackgroundColorKeyword", + "description": "Adjust the background of the element.", + "isOptional": true, + "defaultValue": "'transparent'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "cancelBubble", - "value": "boolean", - "description": "The **`cancelBubble`** property of the Event interface is deprecated.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelBubble)" + "name": "blockSize", + "value": "MaybeResponsive", + "description": "Adjust the block size.", + "isOptional": true, + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "CAPTURING_PHASE", - "value": "1", - "description": "" + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "colno", - "value": "number", - "description": "The **`colno`** read-only property of the ErrorEvent interface returns an integer containing the column number of the script file on which the error occurred.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/colno)" + "name": "borderColor", + "value": "ColorKeyword | ''", + "description": "Set the color of the border.\n\nIf set, it takes precedence over the `border` property's color.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "composed", - "value": "boolean", - "description": "The read-only **`composed`** property of the or not the event will propagate across the shadow DOM boundary into the standard DOM.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composed)" + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Set the radius of the border.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `start-start start-end end-end end-start`\n- 3 values: `start-start (start-end & end-start) start-end`\n- 2 values: `(start-start & end-end) (start-end & end-start)`\n\nFor example:\n- `small-100` means start-start, start-end, end-end and end-start border radii are `small-100`.\n- `small-100 none` means start-start and end-end border radii are `small-100`, start-end and end-start border radii are `none`.\n- `small-100 none large-100` means start-start border radius is `small-100`, start-end border radius is `none`, end-end border radius is `large-100` and end-start border radius is `none`.\n- `small-100 none large-100 small-100` means start-start border radius is `small-100`, start-end border radius is `none`, end-end border radius is `large-100` and end-start border radius is `small-100`.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "composedPath", - "value": "() => EventTarget[]", - "description": "The **`composedPath()`** method of the Event interface returns the event's path which is an array of the objects on which listeners will be invoked.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composedPath)" + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "MaybeAllValuesShorthandProperty | ''", + "description": "Set the style of the border.\n\nIf set, it takes precedence over the `border` property's style.\n\nLike CSS, up to 4 values can be specified.\n\nIf one value is specified, it applies to all sides.\n\nIf two values are specified, they apply to the block sides and inline sides respectively.\n\nIf three values are specified, they apply to the block-start, both inline sides, and block-end respectively.\n\nIf four values are specified, they apply to the block-start, block-end, inline-start, and inline-end sides respectively.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "currentTarget", - "value": "EventTarget | null", - "description": "The **`currentTarget`** read-only property of the Event interface identifies the element to which the event handler has been attached.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/currentTarget)" + "name": "borderWidth", + "value": "MaybeAllValuesShorthandProperty | ''", + "description": "Set the width of the border.\n\nIf set, it takes precedence over the `border` property's width.\n\nLike CSS, up to 4 values can be specified.\n\nIf one value is specified, it applies to all sides.\n\nIf two values are specified, they apply to the block sides and inline sides respectively.\n\nIf three values are specified, they apply to the block-start, both inline sides, and block-end respectively.\n\nIf four values are specified, they apply to the block-start, block-end, inline-start, and inline-end sides respectively.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultPrevented", - "value": "boolean", - "description": "The **`defaultPrevented`** read-only property of the Event interface returns a boolean value indicating whether or not the call to Event.preventDefault() canceled the event.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/defaultPrevented)" + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Box.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", - "value": "AggregateError", - "description": "The aggregated error object containing multiple individual errors. Access the `errors` property to retrieve the array of individual error instances." + "name": "display", + "value": "MaybeResponsive<'auto' | 'none'>", + "description": "Sets the outer display type of the component. The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "isOptional": true, + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "eventPhase", - "value": "number", - "description": "The **`eventPhase`** read-only property of the being evaluated.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/eventPhase)" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "filename", - "value": "string", - "description": "The **`filename`** read-only property of the ErrorEvent interface returns a string containing the name of the script file in which the error occurred.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/filename)" + "name": "inlineSize", + "value": "MaybeResponsive", + "description": "Adjust the inline size.", + "isOptional": true, + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "initEvent", - "value": "(type: string, bubbles?: boolean, cancelable?: boolean) => void", - "description": "The **`Event.initEvent()`** method is used to initialize the value of an event created using Document.createEvent().", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/initEvent)" + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "MaybeResponsive", + "description": "Adjust the maximum block size.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "isTrusted", - "value": "boolean", - "description": "The **`isTrusted`** read-only property of the when the event was generated by the user agent (including via user actions and programmatic methods such as HTMLElement.focus()), and `false` when the event was dispatched via The only exception is the `click` event, which initializes the `isTrusted` property to `false` in user agents.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/isTrusted)" + "name": "maxInlineSize", + "value": "MaybeResponsive", + "description": "Adjust the maximum inline size.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "lineno", - "value": "number", - "description": "The **`lineno`** read-only property of the ErrorEvent interface returns an integer containing the line number of the script file on which the error occurred.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/lineno)" + "name": "minBlockSize", + "value": "MaybeResponsive", + "description": "Adjust the minimum block size.", + "isOptional": true, + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "message", - "value": "string", - "description": "The **`message`** read-only property of the ErrorEvent interface returns a string containing a human-readable error message describing the problem.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/message)" + "name": "minInlineSize", + "value": "MaybeResponsive", + "description": "Adjust the minimum inline size.", + "isOptional": true, + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "NONE", - "value": "0", - "description": "" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "preventDefault", - "value": "() => void", - "description": "The **`preventDefault()`** method of the Event interface tells the user agent that if the event does not get explicitly handled, its default action should not be taken as it normally would be.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/preventDefault)" + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "returnValue", - "value": "boolean", - "description": "The Event property **`returnValue`** indicates whether the default action for this event has been prevented or not.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/returnValue)" + "name": "padding", + "value": "MaybeResponsive>", + "description": "Adjust the padding of all edges.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `block-start inline-end block-end inline-start`\n- 3 values: `block-start inline block-end`\n- 2 values: `block inline`\n\nFor example:\n- `large` means block-start, inline-end, block-end and inline-start paddings are `large`.\n- `large none` means block-start and block-end paddings are `large`, inline-start and inline-end paddings are `none`.\n- `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`.\n- `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`.\n\nA padding value of `auto` will use the default padding for the closest container that has had its usual padding removed.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "srcElement", - "value": "EventTarget | null", - "description": "The deprecated **`Event.srcElement`** is an alias for the Event.target property.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/srcElement)" + "name": "paddingBlock", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the block-padding.\n\n- `large none` means block-start padding is `large`, block-end padding is `none`.\n\nThis overrides the block value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "stopImmediatePropagation", - "value": "() => void", - "description": "The **`stopImmediatePropagation()`** method of the If several listeners are attached to the same element for the same event type, they are called in the order in which they were added.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopImmediatePropagation)" + "syntaxKind": "PropertySignature", + "name": "paddingBlockEnd", + "value": "MaybeResponsive", + "description": "Adjust the block-end padding.\n\nThis overrides the block-end value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "stopPropagation", - "value": "() => void", - "description": "The **`stopPropagation()`** method of the Event interface prevents further propagation of the current event in the capturing and bubbling phases.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopPropagation)" + "syntaxKind": "PropertySignature", + "name": "paddingBlockStart", + "value": "MaybeResponsive", + "description": "Adjust the block-start padding.\n\nThis overrides the block-start value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "target", - "value": "EventTarget | null", - "description": "The read-only **`target`** property of the dispatched.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/target)" + "name": "paddingInline", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the inline padding.\n\n- `large none` means inline-start padding is `large`, inline-end padding is `none`.\n\nThis overrides the inline value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "timeStamp", - "value": "DOMHighResTimeStamp", - "description": "The **`timeStamp`** read-only property of the Event interface returns the time (in milliseconds) at which the event was created.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/timeStamp)" + "name": "paddingInlineEnd", + "value": "MaybeResponsive", + "description": "Adjust the inline-end padding.\n\nThis overrides the inline-end value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "type", - "value": "string", - "description": "The **`type`** read-only property of the Event interface returns a string containing the event's type.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/type)" + "name": "paddingInlineStart", + "value": "MaybeResponsive", + "description": "Adjust the inline-start padding.\n\nThis overrides the inline-start value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" } - ], - "value": "export interface AggregateErrorEvent extends ErrorEvent {\n /**\n * The aggregated error object containing multiple individual errors.\n * Access the `errors` property to retrieve the array of individual error instances.\n */\n error: AggregateError;\n}" - } - }, - "ToneKeyword": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ToneKeyword", - "value": "'auto' | 'neutral' | 'info' | 'success' | 'caution' | 'warning' | 'critical' | 'accent' | 'custom'", - "description": "Defines the semantic color treatment of a component to convey specific intent or status.\n\nTones apply coordinated color schemes (text, background, icons) across the component. Some components, like banner, also use tone to determine accessibility attributes and screen reader announcements.\n\n- `auto`: Automatically determined based on context.\n- `neutral`: General-purpose information without specific sentiment.\n- `info`: Informational content that provides helpful details or guidance.\n- `success`: Positive outcomes, successful operations, or confirmations.\n- `caution`: Warnings about potential issues that require attention but aren't critical.\n- `warning`: Similar to caution, indicates something that needs user awareness.\n- `critical`: Errors, failures, or urgent issues that require immediate attention.\n- `accent`: Highlighted or emphasized content that doesn't fit other semantic tones.\n- `custom`: Custom color treatment defined by your theme or implementation.", - "isPublicDocs": true - } - }, - "IconType": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "IconType", - "value": "'replace' | 'search' | 'split' | 'link' | 'edit' | 'info' | 'incomplete' | 'complete' | 'product' | 'variant' | 'collection' | 'select' | 'color' | 'money' | 'order' | 'code' | 'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code-add' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color-none' | 'compass' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'lightbulb' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", - "description": "Represents the available icon names that can be used in icon components. This is derived from the complete list of supported icons in the design system.", - "isPublicDocs": true - } - }, - "ExtractStrict": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ExtractStrict", - "value": "", - "description": "A type-safe version of TypeScript's `Extract` utility that constrains the second type parameter to be assignable to the first. This provides compile-time validation that you're only extracting types that actually exist within the union, catching potential errors earlier in development.", - "isPublicDocs": true + ] } }, - "optionalSpace": { + "ResponsiveBoxProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", - "name": "optionalSpace", - "value": "'' | ' '", - "description": "A utility type representing an optional space character for use in string literal type composition. Allows flexible formatting of compound values where spacing is a matter of preference rather than semantic difference.", - "isPublicDocs": true - } - }, - "DisplayProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "DisplayProps", - "description": "", + "name": "ResponsiveBoxProps", + "value": "MakeResponsivePick<\n RequiredBoxProps,\n | 'padding'\n | 'paddingBlock'\n | 'paddingBlockStart'\n | 'paddingBlockEnd'\n | 'paddingInline'\n | 'paddingInlineStart'\n | 'paddingInlineEnd'\n | 'display'\n>", + "description": "The box properties that support responsive values through container queries.", "isPublicDocs": true, "members": [ { @@ -13626,89 +15225,81 @@ "syntaxKind": "PropertySignature", "name": "display", "value": "MaybeResponsive<'auto' | 'none'>", - "description": "The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n\nLearn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).", + "description": "Sets the outer display type of the component. The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", "isOptional": true, "defaultValue": "'auto'" - } - ], - "value": "export interface DisplayProps {\n /**\n * The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n *\n * - `auto`: the component’s initial value. The actual value depends on the component and context.\n * - `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n *\n * Learn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).\n *\n * @default 'auto'\n */\n display?: MaybeResponsive<'auto' | 'none'>;\n}" - } - }, - "AccessibilityRoleProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AccessibilityRoleProps", - "description": "", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityRole", - "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "name": "padding", + "value": "MaybeResponsive>", + "description": "Adjust the padding of all edges.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `block-start inline-end block-end inline-start`\n- 3 values: `block-start inline block-end`\n- 2 values: `block inline`\n\nFor example:\n- `large` means block-start, inline-end, block-end and inline-start paddings are `large`.\n- `large none` means block-start and block-end paddings are `large`, inline-start and inline-end paddings are `none`.\n- `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`.\n- `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`.\n\nA padding value of `auto` will use the default padding for the closest container that has had its usual padding removed.", "isOptional": true, - "defaultValue": "'generic'" - } - ], - "value": "export interface AccessibilityRoleProps {\n /**\n * The semantic meaning of the component’s content. When set,\n * the role will be used by assistive technologies to help users\n * navigate the page.\n *\n * @implementation Although, in HTML hosts, this property changes the element used,\n * changing this property must not impact the visual styling of inside or outside of the box.\n *\n * @default 'generic'\n */\n accessibilityRole?: AccessibilityRole;\n}" - } - }, - "LabelAccessibilityVisibilityProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "LabelAccessibilityVisibilityProps", - "description": "", - "isPublicDocs": true, - "members": [ + "defaultValue": "'none'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "labelAccessibilityVisibility", - "value": "'visible' | 'exclusive'", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "name": "paddingBlock", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the block-padding.\n\n- `large none` means block-start padding is `large`, block-end padding is `none`.\n\nThis overrides the block value of `padding`.", "isOptional": true, - "defaultValue": "'visible'" - } - ], - "value": "export interface LabelAccessibilityVisibilityProps {\n /**\n * Controls whether the label is visible to all users or only to screen readers.\n *\n * - `visible`: The label is shown to everyone (default).\n * - `exclusive`: The label is visually hidden but still announced by screen readers.\n *\n * Use `exclusive` when the surrounding context makes the label redundant visually,\n * but screen reader users still need it for clarity.\n *\n * @default 'visible'\n */\n labelAccessibilityVisibility?: ExtractStrict<\n AccessibilityVisibilityProps['accessibilityVisibility'],\n 'visible' | 'exclusive'\n >;\n}" - } - }, - "BorderRadiusKeyword": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "BorderRadiusKeyword", - "value": "SizeKeyword | 'max' | 'none'", - "description": "Defines the radius of rounded corners, using the standard size scale, `max` for fully rounded, or `none` for sharp corners.", - "isPublicDocs": true - } - }, - "OverflowProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "OverflowProps", - "description": "", - "isPublicDocs": true, - "members": [ + "defaultValue": "'' - meaning no override" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "overflow", - "value": "'hidden' | 'visible'", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "name": "paddingBlockEnd", + "value": "MaybeResponsive", + "description": "Adjust the block-end padding.\n\nThis overrides the block-end value of `paddingBlock`.", "isOptional": true, - "defaultValue": "'visible'" + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockStart", + "value": "MaybeResponsive", + "description": "Adjust the block-start padding.\n\nThis overrides the block-start value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInline", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the inline padding.\n\n- `large none` means inline-start padding is `large`, inline-end padding is `none`.\n\nThis overrides the inline value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineEnd", + "value": "MaybeResponsive", + "description": "Adjust the inline-end padding.\n\nThis overrides the inline-end value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineStart", + "value": "MaybeResponsive", + "description": "Adjust the inline-start padding.\n\nThis overrides the inline-start value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" } - ], - "value": "export interface OverflowProps {\n /**\n * The overflow behavior of the element.\n *\n * - `visible`: the content that extends beyond the element’s container is visible.\n * - `hidden`: clips the content when it is larger than the element’s container.\n * The element will not be scrollable and the users will not be able\n * to access the clipped content by dragging or using a scroll wheel on a mouse.\n *\n * @default 'visible'\n */\n overflow?: 'hidden' | 'visible';\n}" + ] } }, - "BaseBoxProps": { + "BoxProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseBoxProps", - "description": "", + "name": "BoxProps", + "description": "The properties for the box component. A box provides control over layout, spacing, sizing, borders, and background styling for its content.", "isPublicDocs": true, "members": [ { @@ -13716,15 +15307,24 @@ "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "accessibilityVisibility", "value": "'visible' | 'hidden' | 'exclusive'", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "isOptional": true, "defaultValue": "'visible'" }, @@ -13732,18 +15332,16 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "background", - "value": "BackgroundColorKeyword", - "description": "The background color of the element. Use `transparent` for no background, `subdued` for a subtle background, `base` for standard background, or `strong` for a prominent background.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isOptional": true, + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blockSize", - "value": "MaybeResponsive", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about the [block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -13751,7 +15349,7 @@ "syntaxKind": "PropertySignature", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.\n\nAccepts a size value, optionally followed by a color, optionally followed by a style. Omitted values use defaults: color defaults to `base`, style defaults to `auto`.\n\nIndividual properties (`borderWidth`, `borderStyle`, `borderColor`) can override values set here.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "isOptional": true, "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ @@ -13771,98 +15369,80 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "borderColor", - "value": "ColorKeyword | ''", - "description": "The color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", - "isOptional": true, + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- One value: applies to all corners\n- Two values: applies to start corners (top-left & bottom-right) and end corners (top-right & bottom-left) respectively\n- Three values: applies to start-start (top-left), end corners (top-right & bottom-left), and end-end (bottom-right) respectively\n- Four values: applies to start-start (top-left), start-end (top-right), end-end (bottom-right), and end-start (bottom-left) respectively\n\nExamples:\n- `small-100`: All corners have `small-100` radius\n- `small-100 none`: Top-left and bottom-right are `small-100`, top-right and bottom-left are `none`\n- `small-100 none large-100`: Top-left is `small-100`, top-right and bottom-left are `none`, bottom-right is `large-100`\n- `small-100 none large-100 base`: Each corner has its specified radius value", - "isOptional": true, + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "borderStyle", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted.\n\nWhen set, this overrides the style value specified in the `border` property.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different styles per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", - "isOptional": true, + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "borderWidth", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", - "isOptional": true, + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The content displayed within the box component, which serves as a flexible container for organizing and styling other components.", - "isOptional": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "display", - "value": "MaybeResponsive<'auto' | 'none'>", - "description": "The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n\nLearn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).", - "isOptional": true, + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "inlineSize", - "value": "MaybeResponsive", - "description": "The horizontal size of the element in standard layouts (width in left-to-right or right-to-left writing modes).\n\nInline size adjusts based on the writing direction: in horizontal layouts, it controls the width; in vertical layouts, it controls the height. This ensures consistent behavior across different text directions.\n\nLearn more about the [inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "maxBlockSize", - "value": "MaybeResponsive", - "description": "The maximum vertical size of the element in standard layouts (max-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the block axis.\n\nLearn more about the [max-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", - "isOptional": true, + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "maxInlineSize", - "value": "MaybeResponsive", - "description": "The maximum horizontal size of the element in standard layouts (max-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the inline axis.\n\nLearn more about the [max-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", - "isOptional": true, + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "minBlockSize", - "value": "MaybeResponsive", - "description": "The minimum vertical size of the element in standard layouts (min-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the block axis.\n\nLearn more about the [min-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", - "isOptional": true, + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "minInlineSize", - "value": "MaybeResponsive", - "description": "The minimum horizontal size of the element in standard layouts (min-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the inline axis.\n\nLearn more about the [min-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", - "isOptional": true, + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -13870,7 +15450,7 @@ "syntaxKind": "PropertySignature", "name": "overflow", "value": "'hidden' | 'visible'", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "isOptional": true, "defaultValue": "'visible'" }, @@ -13879,73 +15459,66 @@ "syntaxKind": "PropertySignature", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding.", - "isOptional": true, + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingBlock", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingBlockEnd", - "value": "MaybeResponsive", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingBlockStart", - "value": "MaybeResponsive", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingInline", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingInlineEnd", - "value": "MaybeResponsive", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingInlineStart", - "value": "MaybeResponsive", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" } ], - "value": "export interface BaseBoxProps\n extends AccessibilityVisibilityProps,\n BackgroundProps,\n DisplayProps,\n SizingProps,\n PaddingProps,\n BorderProps,\n OverflowProps {\n /**\n * The content displayed within the box component, which serves as a flexible container for organizing and styling other components.\n */\n children?: ComponentChildren;\n /**\n * A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.\n */\n accessibilityLabel?: string;\n}" + "value": "export interface BoxProps\n extends Pick<\n RequiredBoxProps,\n | 'accessibilityLabel'\n | 'accessibilityRole'\n | 'accessibilityVisibility'\n | 'background'\n | 'blockSize'\n | 'border'\n | 'borderColor'\n | 'borderRadius'\n | 'borderStyle'\n | 'borderWidth'\n | 'inlineSize'\n | 'maxBlockSize'\n | 'maxInlineSize'\n | 'minBlockSize'\n | 'minInlineSize'\n | 'overflow'\n > {\n /**\n * The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.\n *\n * @default 'transparent'\n */\n background: Extract<\n RequiredBoxProps['background'],\n 'transparent' | 'base' | 'subdued' | 'strong'\n >;\n /**\n * Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n *\n * - `small`: Thin border for subtle definition.\n * - `small-100`: Extra thin border for minimal emphasis.\n * - `base`: Standard border width.\n * - `large`: Thick border for strong emphasis.\n * - `large-100`: Extra thick border for maximum prominence.\n * - `none`: No border.\n *\n * Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.\n *\n * @default '' - meaning no override\n */\n borderWidth:\n | MaybeAllValuesShorthandProperty<\n Extract<\n RequiredBoxProps['borderWidth'],\n 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'none'\n >\n >\n | Extract;\n /**\n * Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n *\n * When set, this overrides the style value specified in the `border` property.\n * Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides,\n * two values apply to block and inline sides, and so on.\n *\n * @default '' - meaning no override\n */\n borderStyle:\n | MaybeAllValuesShorthandProperty\n | Extract;\n /**\n * Controls the color of the border using the design system's color scale.\n *\n * When set, this overrides the color value specified in the `border` property.\n * Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.\n *\n * @default '' - meaning no override\n */\n borderColor: Extract<\n RequiredBoxProps['borderColor'],\n 'subdued' | 'base' | 'strong' | ''\n >;\n /**\n * Controls the roundedness of the element's corners using the design system's radius scale.\n *\n * Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements.\n * One value applies to all corners, two values apply to opposite corners, and so on.\n *\n * @default 'none'\n */\n borderRadius: MaybeAllValuesShorthandProperty;\n /**\n * The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.\n *\n * @default 'none'\n */\n padding: ResponsiveBoxProps['padding'];\n /**\n * The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.\n *\n * @default '' - meaning no override\n */\n paddingBlock: ResponsiveBoxProps['paddingBlock'];\n /**\n * The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.\n *\n * @default '' - meaning no override\n */\n paddingBlockStart: ResponsiveBoxProps['paddingBlockStart'];\n /**\n * The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.\n *\n * @default '' - meaning no override\n */\n paddingBlockEnd: ResponsiveBoxProps['paddingBlockEnd'];\n /**\n * The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.\n *\n * @default '' - meaning no override\n */\n paddingInline: ResponsiveBoxProps['paddingInline'];\n /**\n * The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.\n *\n * @default '' - meaning no override\n */\n paddingInlineStart: ResponsiveBoxProps['paddingInlineStart'];\n /**\n * The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.\n *\n * @default '' - meaning no override\n */\n paddingInlineEnd: ResponsiveBoxProps['paddingInlineEnd'];\n /**\n * The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.\n *\n * @default 'auto'\n */\n display: ResponsiveBoxProps['display'];\n /**\n * The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n *\n * Block size adjusts based on the writing direction: in horizontal layouts, it controls the height;\n * in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n *\n * Learn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n *\n * @default 'auto'\n */\n blockSize: SizeUnitsOrAuto;\n /**\n * The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).\n *\n * @default '0'\n */\n minBlockSize: SizeUnits;\n /**\n * The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).\n *\n * @default 'none'\n */\n maxBlockSize: SizeUnitsOrNone;\n /**\n * The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).\n *\n * @default 'auto'\n */\n inlineSize: SizeUnitsOrAuto;\n /**\n * The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).\n *\n * @default '0'\n */\n minInlineSize: SizeUnits;\n /**\n * The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).\n *\n * @default 'none'\n */\n maxInlineSize: SizeUnitsOrNone;\n}" } }, - "BaseBoxPropsWithRole": { + "BoxJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseBoxPropsWithRole", - "description": "", + "name": "BoxJSXProps", + "description": "The properties for the box component when it's used in JSX.", "isPublicDocs": true, "members": [ { @@ -13953,7 +15526,7 @@ "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { @@ -13961,7 +15534,7 @@ "syntaxKind": "PropertySignature", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "isOptional": true, "defaultValue": "'generic'" }, @@ -13970,7 +15543,7 @@ "syntaxKind": "PropertySignature", "name": "accessibilityVisibility", "value": "'visible' | 'hidden' | 'exclusive'", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "isOptional": true, "defaultValue": "'visible'" }, @@ -13978,18 +15551,16 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "background", - "value": "BackgroundColorKeyword", - "description": "The background color of the element. Use `transparent` for no background, `subdued` for a subtle background, `base` for standard background, or `strong` for a prominent background.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isOptional": true, + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blockSize", - "value": "MaybeResponsive", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about the [block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -13997,7 +15568,7 @@ "syntaxKind": "PropertySignature", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.\n\nAccepts a size value, optionally followed by a color, optionally followed by a style. Omitted values use defaults: color defaults to `base`, style defaults to `auto`.\n\nIndividual properties (`borderWidth`, `borderStyle`, `borderColor`) can override values set here.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "isOptional": true, "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ @@ -14017,36 +15588,32 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "borderColor", - "value": "ColorKeyword | ''", - "description": "The color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", - "isOptional": true, + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- One value: applies to all corners\n- Two values: applies to start corners (top-left & bottom-right) and end corners (top-right & bottom-left) respectively\n- Three values: applies to start-start (top-left), end corners (top-right & bottom-left), and end-end (bottom-right) respectively\n- Four values: applies to start-start (top-left), start-end (top-right), end-end (bottom-right), and end-start (bottom-left) respectively\n\nExamples:\n- `small-100`: All corners have `small-100` radius\n- `small-100 none`: Top-left and bottom-right are `small-100`, top-right and bottom-left are `none`\n- `small-100 none large-100`: Top-left is `small-100`, top-right and bottom-left are `none`, bottom-right is `large-100`\n- `small-100 none large-100 base`: Each corner has its specified radius value", - "isOptional": true, + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "borderStyle", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted.\n\nWhen set, this overrides the style value specified in the `border` property.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different styles per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", - "isOptional": true, + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "borderWidth", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", - "isOptional": true, + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -14054,61 +15621,63 @@ "syntaxKind": "PropertySignature", "name": "children", "value": "ComponentChildren", - "description": "The content displayed within the box component, which serves as a flexible container for organizing and styling other components.", + "description": "The child elements to render inside the box.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "display", - "value": "MaybeResponsive<'auto' | 'none'>", - "description": "The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n\nLearn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).", - "isOptional": true, + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "inlineSize", - "value": "MaybeResponsive", - "description": "The horizontal size of the element in standard layouts (width in left-to-right or right-to-left writing modes).\n\nInline size adjusts based on the writing direction: in horizontal layouts, it controls the width; in vertical layouts, it controls the height. This ensures consistent behavior across different text directions.\n\nLearn more about the [inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "maxBlockSize", - "value": "MaybeResponsive", - "description": "The maximum vertical size of the element in standard layouts (max-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the block axis.\n\nLearn more about the [max-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", - "isOptional": true, + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "maxInlineSize", - "value": "MaybeResponsive", - "description": "The maximum horizontal size of the element in standard layouts (max-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the inline axis.\n\nLearn more about the [max-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", - "isOptional": true, + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "minBlockSize", - "value": "MaybeResponsive", - "description": "The minimum vertical size of the element in standard layouts (min-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the block axis.\n\nLearn more about the [min-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", - "isOptional": true, + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "minInlineSize", - "value": "MaybeResponsive", - "description": "The minimum horizontal size of the element in standard layouts (min-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the inline axis.\n\nLearn more about the [min-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", - "isOptional": true, + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -14116,7 +15685,7 @@ "syntaxKind": "PropertySignature", "name": "overflow", "value": "'hidden' | 'visible'", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "isOptional": true, "defaultValue": "'visible'" }, @@ -14125,209 +15694,185 @@ "syntaxKind": "PropertySignature", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding.", - "isOptional": true, + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingBlock", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingBlockEnd", - "value": "MaybeResponsive", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingBlockStart", - "value": "MaybeResponsive", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingInline", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingInlineEnd", - "value": "MaybeResponsive", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingInlineStart", - "value": "MaybeResponsive", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" } ], - "value": "export interface BaseBoxPropsWithRole\n extends BaseBoxProps,\n AccessibilityRoleProps {}" + "value": "export interface BoxJSXProps\n extends Partial,\n Pick {\n /**\n * The child elements to render inside the box.\n */\n children?: ComponentChildren;\n}" } }, - "ButtonBehaviorProps": { + "ButtonOnlyProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ButtonBehaviorProps", - "description": "", + "syntaxKind": "TypeAliasDeclaration", + "name": "ButtonOnlyProps", + "value": "", + "description": "The button-specific properties extracted from the base button props type, used internally for type safety.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", - "isOptional": true, - "defaultValue": "'--auto'" + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Button. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the Button text is not enough context for users using assistive technologies.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Button.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", - "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'--auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", + "name": "commandFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "loading", + "name": "disabled", "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", + "description": "Disables the Button meaning it cannot be clicked or receive focus.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onBlur", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "onClick", - "value": "(event: Event) => void", - "description": "A callback fired when the button is activated, before performing the action indicated by `type`. Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onFocus", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "type", - "value": "'submit' | 'button' | 'reset'", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "name": "icon", + "value": "IconType | AnyString", + "description": "The type of icon to be displayed in the Button.", "isOptional": true, - "defaultValue": "'button'" - } - ], - "value": "export interface ButtonBehaviorProps extends InteractionProps, FocusEventProps {\n /**\n * The behavior of the button component.\n *\n * - `button`: Used to indicate the component acts as a button, meaning it has no default action.\n * - `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n * - `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n *\n * This property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.\n *\n * @default 'button'\n */\n type?: 'submit' | 'button' | 'reset';\n /**\n * A callback fired when the button is activated, before performing the action indicated by `type`. Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n onClick?: (event: Event) => void;\n /**\n * Whether the button is disabled, preventing it from being clicked or receiving focus.\n *\n * @default false\n */\n disabled?: boolean;\n /**\n * Whether to replace the button content with a loading indicator while a background action is being performed.\n *\n * This also disables the button component.\n *\n * @default false\n */\n loading?: boolean;\n}" - } - }, - "LinkBehaviorProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "LinkBehaviorProps", - "description": "", - "isPublicDocs": true, - "members": [ + "defaultValue": "''" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", - "isOptional": true, - "defaultValue": "'--auto'" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", - "isOptional": true + "name": "inlineSize", + "value": "'auto' | 'fill' | 'fit-content'", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", + "isOptional": true, + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "download", + "name": "interestFor", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "href", + "name": "lang", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", - "isOptional": true + "name": "loading", + "value": "boolean", + "description": "Replaces content with a loading indicator while a background action is being performed.\n\nThis also disables the Button.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "onBlur", "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "Callback when the element loses focus.", "isOptional": true }, { @@ -14335,7 +15880,7 @@ "syntaxKind": "PropertySignature", "name": "onClick", "value": "(event: Event) => void", - "description": "A callback fired when the link is activated, before navigating to the location specified by `href`. Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", + "description": "Callback when the Button is activated. This will be called before the action indicated by `type`.", "isOptional": true }, { @@ -14343,7 +15888,7 @@ "syntaxKind": "PropertySignature", "name": "onFocus", "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "Callback when the element receives focus.", "isOptional": true }, { @@ -14351,63 +15896,63 @@ "syntaxKind": "PropertySignature", "name": "target", "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "isOptional": true, "defaultValue": "'auto'" - } - ], - "value": "export interface LinkBehaviorProps extends InteractionProps, FocusEventProps {\n /**\n * The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.\n */\n href?: string;\n /**\n * The browsing context where the linked URL should be displayed.\n *\n * - `auto`: The target is automatically determined based on the origin of the URL.\n * - `_blank`: Opens the URL in a new window or tab.\n * - `_self`: Opens the URL in the same browsing context as the current one.\n * - `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n * - `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.\n *\n * @implementation Surfaces can set specific rules on how they handle each URL.\n * @implementation It’s expected that the behavior of `auto` is as `_self` except in specific cases.\n * @implementation For example, a surface could decide to open cross-origin URLs in a new window (as `_blank`).\n *\n * Learn more about the [target attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#target).\n *\n * @default 'auto'\n */\n target?: 'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString;\n /**\n * Prompts the browser to download the linked URL rather than navigate to it.\n * When set, the value specifies the suggested filename for the downloaded file.\n *\n * The filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes.\n * Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n *\n * Learn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).\n */\n download?: string;\n /**\n * A callback fired when the link is activated, before navigating to the location specified by `href`. Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n onClick?: (event: Event) => void;\n}" - } - }, - "InteractionProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "InteractionProps", - "description": "", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", + "name": "tone", + "value": "ToneKeyword", + "description": "Sets the tone of the Button based on the intention of the information being conveyed.", "isOptional": true, - "defaultValue": "'--auto'" + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", - "isOptional": true + "name": "type", + "value": "'submit' | 'button' | 'reset'", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "isOptional": true, + "defaultValue": "'button'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", - "isOptional": true + "name": "variant", + "value": "'auto' | 'primary' | 'secondary' | 'tertiary'", + "description": "Changes the visual appearance of the Button.", + "isOptional": true, + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" } - ], - "value": "export interface InteractionProps {\n /**\n * The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).\n */\n commandFor?: string;\n /**\n * The action that `commandFor` should take when this component is activated.\n *\n * - `--auto`: A default action for the target component.\n * - `--show`: Shows the target component.\n * - `--hide`: Hides the target component.\n * - `--toggle`: Toggles the visibility of the target component.\n * - `--copy`: Copies the target `ClipboardItem`.\n *\n * Learn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).\n *\n * @default '--auto'\n */\n command?: '--auto' | '--show' | '--hide' | '--toggle' | '--copy';\n /**\n * The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.\n */\n interestFor?: string;\n}" + ] } }, - "BaseClickableProps": { + "ButtonBaseProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseClickableProps", - "description": "", + "syntaxKind": "TypeAliasDeclaration", + "name": "ButtonBaseProps", + "value": "Required<\n Pick<\n ButtonOnlyProps,\n | 'accessibilityLabel'\n | 'disabled'\n | 'command'\n | 'commandFor'\n | 'icon'\n | 'interestFor'\n | 'lang'\n | 'loading'\n | 'type'\n | 'tone'\n | 'variant'\n | 'target'\n | 'href'\n | 'download'\n | 'inlineSize'\n >\n>", + "description": "The base required properties for the button component, including all essential button configuration options. This type ensures all button properties have default values.", "isPublicDocs": true, "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Button. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the Button text is not enough context for users using assistive technologies.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", "isOptional": true, "defaultValue": "'--auto'" }, @@ -14416,7 +15961,7 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", "isOptional": true }, { @@ -14424,7 +15969,7 @@ "syntaxKind": "PropertySignature", "name": "disabled", "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", + "description": "Disables the Button meaning it cannot be clicked or receive focus.", "isOptional": true, "defaultValue": "false" }, @@ -14433,7 +15978,7 @@ "syntaxKind": "PropertySignature", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", "isOptional": true }, { @@ -14441,56 +15986,67 @@ "syntaxKind": "PropertySignature", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", - "isOptional": true + "name": "icon", + "value": "IconType | AnyString", + "description": "The type of icon to be displayed in the Button.", + "isOptional": true, + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "loading", - "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", + "name": "inlineSize", + "value": "'auto' | 'fill' | 'fit-content'", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onBlur", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onClick", - "value": "(event: Event) => void", - "description": "A callback fired when the button is activated, before performing the action indicated by `type`. Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onFocus", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", - "isOptional": true + "name": "loading", + "value": "boolean", + "description": "Replaces content with a loading indicator while a background action is being performed.\n\nThis also disables the Button.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "target", "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "ToneKeyword", + "description": "Sets the tone of the Button based on the intention of the information being conveyed.", "isOptional": true, "defaultValue": "'auto'" }, @@ -14499,55 +16055,52 @@ "syntaxKind": "PropertySignature", "name": "type", "value": "'submit' | 'button' | 'reset'", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "isOptional": true, "defaultValue": "'button'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "variant", + "value": "'auto' | 'primary' | 'secondary' | 'tertiary'", + "description": "Changes the visual appearance of the Button.", + "isOptional": true, + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" } - ], - "value": "export interface BaseClickableProps\n extends ButtonBehaviorProps,\n LinkBehaviorProps {}" + ] } }, - "BaseInputProps": { + "ButtonProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseInputProps", - "description": "", + "name": "ButtonProps", + "description": "The properties for the button component. Buttons trigger actions or navigation when clicked, with customizable visual styles, states, and optional icons.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", - "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", - "isOptional": true, - "defaultValue": "false" + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Button. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the Button text is not enough context for users using assistive technologies.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "name", - "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", - "isOptional": true - } - ], - "value": "export interface BaseInputProps {\n /**\n * The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.\n */\n name?: string;\n /**\n * Whether the field is disabled, preventing any user interaction.\n *\n * @default false\n */\n disabled?: boolean;\n}" - } - }, - "InputProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "InputProps", - "description": "", - "isPublicDocs": true, - "members": [ + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultValue", + "name": "commandFor", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", "isOptional": true }, { @@ -14555,647 +16108,476 @@ "syntaxKind": "PropertySignature", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the Button meaning it cannot be clicked or receive focus.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "name", + "name": "download", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onChange", - "value": "(event: Event) => void", - "description": "A callback fired when the user has finished editing the field, such as when they blur the field or press Enter. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onInput", - "value": "(event: Event) => void", - "description": "A callback fired when the user makes any changes in the field, such as typing a character. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).", - "isOptional": true + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "value", - "value": "string", - "description": "", - "isOptional": true - } - ], - "value": "export interface InputProps extends BaseInputProps {\n /**\n * A callback fired when the user has finished editing the field, such as when they blur the field or press Enter. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n onChange?: (event: Event) => void;\n /**\n * A callback fired when the user makes any changes in the field, such as typing a character. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).\n */\n onInput?: (event: Event) => void;\n value?: string;\n /**\n * The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.\n *\n * @implementation `defaultValue` reflects to the `value` attribute.\n */\n defaultValue?: string;\n}" - } - }, - "MultipleInputProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "MultipleInputProps", - "description": "", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "disabled", - "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "name": "inlineSize", + "value": "'auto' | 'fill' | 'fit-content'", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "name", + "name": "interestFor", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "onChange", - "value": "(event: Event) => void", - "description": "A callback fired when the user has selected one or more options. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onInput", - "value": "(event: Event) => void", - "description": "A callback fired when the user selects or deselects options. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "values", - "value": "string[]", - "description": "An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected.", - "isOptional": true - } - ], - "value": "export interface MultipleInputProps extends BaseInputProps {\n /**\n * A callback fired when the user has selected one or more options. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n onChange?: (event: Event) => void;\n /**\n * A callback fired when the user selects or deselects options. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).\n */\n onInput?: (event: Event) => void;\n /**\n * An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected.\n */\n values?: string[];\n}" - } - }, - "FileInputProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "FileInputProps", - "description": "", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "disabled", + "name": "loading", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Replaces content with a loading indicator while a background action is being performed.\n\nThis also disables the Button.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "files", - "value": "ReadonlyArray", - "description": "An array of File objects representing the files currently selected by the user.\n\nThis property is read-only and cannot be directly modified. To clear the selected files, set the `value` prop to an empty string or null.", + "name": "target", + "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", + "description": "Specifies where to display the linked URL.", "isOptional": true, - "defaultValue": "[]" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "name", - "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", - "isOptional": true + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onChange", - "value": "(event: Event) => void", - "description": "A callback fired when the user has finished selecting one or more files.", - "isOptional": true + "name": "tone", + "value": "'critical' | 'auto' | 'neutral'", + "description": "Determines the visual appearance and semantic meaning of the button. Buttons rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - Lets the system automatically choose the appropriate tone based on context.\n- `'neutral'` - Standard styling for general actions without specific semantic meaning.\n- `'critical'` - Red styling for destructive actions that can't be undone, such as deleting data.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onInput", - "value": "(event: Event) => void", - "description": "A callback fired when the user makes any changes to the file selection.", - "isOptional": true + "name": "type", + "value": "'submit' | 'button' | 'reset'", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "isOptional": true, + "defaultValue": "'button'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "value", - "value": "string", - "description": "A string that represents the path to the selected file(s). If no file is selected yet, the value is an empty string (\"\"). When the user selected multiple files, the value represents the first file in the list of files they selected. The value is always the file's name prefixed with \"C:\\fakepath\\\", which isn't the real path of the file.\n\nLearn more about the [file input value](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input/file#value).", + "name": "variant", + "value": "'auto' | 'primary' | 'secondary' | 'tertiary'", + "description": "Changes the visual appearance of the Button.", "isOptional": true, - "defaultValue": "''" + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" } ], - "value": "export interface FileInputProps extends BaseInputProps {\n /**\n * A callback fired when the user has finished selecting one or more files.\n */\n onChange?: (event: Event) => void;\n /**\n * A callback fired when the user makes any changes to the file selection.\n */\n onInput?: (event: Event) => void;\n /**\n * A string that represents the path to the selected file(s). If no file is selected yet, the value is an empty string (\"\").\n * When the user selected multiple files, the value represents the first file in the list of files they selected.\n * The value is always the file's name prefixed with \"C:\\fakepath\\\", which isn't the real path of the file.\n *\n * Learn more about the [file input value](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input/file#value).\n *\n * @default ''\n */\n value?: string;\n /**\n * An array of File objects representing the files currently selected by the user.\n *\n * This property is read-only and cannot be directly modified.\n * To clear the selected files, set the `value` prop to an empty string or null.\n *\n * @default []\n */\n files?: ReadonlyArray;\n}" + "value": "export interface ButtonProps extends ButtonBaseProps {\n /**\n * Determines the visual appearance and semantic meaning of the button. Buttons rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n * - `'auto'` - Lets the system automatically choose the appropriate tone based on context.\n * - `'neutral'` - Standard styling for general actions without specific semantic meaning.\n * - `'critical'` - Red styling for destructive actions that can't be undone, such as deleting data.\n *\n * @default 'auto'\n */\n tone: Extract;\n /**\n * The icon to display inside the button. Accepts any valid icon type or an empty string to display no icon.\n *\n * @default ''\n */\n icon: IconProps['type'];\n}" } }, - "FieldErrorProps": { + "ButtonJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "FieldErrorProps", - "description": "", + "name": "ButtonJSXProps", + "description": "The JSX props for the button component. These properties extend `ButtonProps` with event callbacks and additional options for rendering buttons in JSX.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", + "name": "accessibilityLabel", "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "description": "A label that describes the purpose or contents of the Button. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the Button text is not enough context for users using assistive technologies.", "isOptional": true - } - ], - "value": "export interface FieldErrorProps {\n /**\n * An error message displayed below the checkbox to indicate validation problems.\n * When set, the checkbox is styled with error indicators and the message is announced to screen readers.\n */\n error?: string;\n}" - } - }, - "BasicFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "BasicFieldProps", - "description": "", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "name": "children", + "value": "ComponentChildren", + "description": "The text label or content to display inside the button. Can be plain text or other components.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", - "isOptional": true + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "labelAccessibilityVisibility", - "value": "'visible' | 'exclusive'", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", - "isOptional": true, - "defaultValue": "'visible'" + "name": "commandFor", + "value": "string", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "required", + "name": "disabled", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Disables the Button meaning it cannot be clicked or receive focus.", "isOptional": true, "defaultValue": "false" - } - ], - "value": "export interface BasicFieldProps\n extends FieldErrorProps,\n LabelAccessibilityVisibilityProps {\n /**\n * Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.\n *\n * @default false\n */\n required?: boolean;\n /**\n * The text displayed as the field label, which identifies the purpose of the field to users.\n * This label is associated with the field for accessibility and helps users understand what information to provide.\n */\n label?: string;\n}" - } - }, - "FieldDetailsProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "FieldDetailsProps", - "description": "", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "details", + "name": "download", "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", "isOptional": true - } - ], - "value": "export interface FieldDetailsProps {\n /**\n * Supplementary text displayed below the checkbox to provide additional context, instructions, or help.\n * Use this to explain what checking the box means or provide guidance to users.\n * This text is announced to screen readers.\n */\n details?: string;\n}" - } - }, - "FieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "FieldProps", - "description": "", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultValue", + "name": "href", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "details", + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type or an empty string to display no icon.", + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", - "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "name": "inlineSize", + "value": "'auto' | 'fill' | 'fit-content'", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", + "name": "interestFor", "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "label", + "name": "lang", "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "labelAccessibilityVisibility", - "value": "'visible' | 'exclusive'", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "name": "loading", + "value": "boolean", + "description": "Replaces content with a loading indicator while a background action is being performed.\n\nThis also disables the Button.", "isOptional": true, - "defaultValue": "'visible'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "name", - "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", - "isOptional": true + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "onBlur", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "value": "((event: CallbackEvent) => void) | null", + "description": "Callback function that's invoked when the button loses focus. Receives the blur event as an argument.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onChange", - "value": "(event: Event) => void", - "description": "A callback fired when the user has finished editing the field, such as when they blur the field or press Enter. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "name": "onClick", + "value": "((event: CallbackEvent) => void) | null", + "description": "Callback function that's invoked when the button is clicked. Receives the click event as an argument.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "onFocus", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "value": "((event: CallbackEvent) => void) | null", + "description": "Callback function that's invoked when the button receives focus. Receives the focus event as an argument.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onInput", - "value": "(event: Event) => void", - "description": "A callback fired when the user makes any changes in the field, such as typing a character. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).", - "isOptional": true + "name": "target", + "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", + "description": "Specifies where to display the linked URL.", + "isOptional": true, + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "placeholder", - "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", - "isOptional": true + "name": "tone", + "value": "'critical' | 'auto' | 'neutral'", + "description": "Determines the visual appearance and semantic meaning of the button. Buttons rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - Lets the system automatically choose the appropriate tone based on context.\n- `'neutral'` - Standard styling for general actions without specific semantic meaning.\n- `'critical'` - Red styling for destructive actions that can't be undone, such as deleting data.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "required", - "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "name": "type", + "value": "'submit' | 'button' | 'reset'", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'button'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "value", - "value": "string", - "description": "", - "isOptional": true + "name": "variant", + "value": "'auto' | 'primary' | 'secondary' | 'tertiary'", + "description": "Changes the visual appearance of the Button.", + "isOptional": true, + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" } ], - "value": "export interface FieldProps\n extends BasicFieldProps,\n InputProps,\n FocusEventProps,\n FieldDetailsProps {\n /**\n * The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.\n */\n placeholder?: string;\n}" + "value": "export interface ButtonJSXProps\n extends Partial,\n Pick {\n /**\n * The text label or content to display inside the button. Can be plain text or other components.\n */\n children?: ComponentChildren;\n /**\n * Callback function that's invoked when the button is clicked. Receives the click event as an argument.\n */\n onClick?: ((event: CallbackEvent) => void) | null;\n /**\n * Callback function that's invoked when the button receives focus. Receives the focus event as an argument.\n */\n onFocus?: ((event: CallbackEvent) => void) | null;\n /**\n * Callback function that's invoked when the button loses focus. Receives the blur event as an argument.\n */\n onBlur?: ((event: CallbackEvent) => void) | null;\n}" } }, - "BaseTextFieldProps": { + "ButtonGroupProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseTextFieldProps", - "description": "", + "name": "ButtonGroupProps", + "description": "Properties for rendering a button group that arranges multiple buttons together with consistent spacing and semantic grouping.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultValue", - "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "details", + "name": "accessibilityLabel", "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "description": "Label for the button group that describes the content of the group for screen reader users to understand what's included.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", - "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "name": "gap", + "value": "'base' | 'none'", + "description": "The gap between elements.", "isOptional": true, - "defaultValue": "false" - }, + "defaultValue": "'base'" + } + ], + "value": "export interface ButtonGroupProps\n extends Required> {}" + } + }, + "ButtonGroupJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ButtonGroupJSXProps", + "description": "Properties for using the button group component in JSX with React-style props.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", + "name": "accessibilityLabel", "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "description": "Label for the button group that describes the content of the group for screen reader users to understand what's included.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "name": "children", + "value": "ComponentChildren", + "description": "The buttons that should be grouped together, provided as Button components.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "labelAccessibilityVisibility", - "value": "'visible' | 'exclusive'", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "name": "gap", + "value": "'base' | 'none'", + "description": "The gap between elements.", "isOptional": true, - "defaultValue": "'visible'" + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "name", + "name": "id", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "onBlur", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "onChange", - "value": "(event: Event) => void", - "description": "A callback fired when the user has finished editing the field, such as when they blur the field or press Enter. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "onFocus", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "onInput", - "value": "(event: Event) => void", - "description": "A callback fired when the user makes any changes in the field, such as typing a character. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "placeholder", - "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "name": "primaryAction", + "value": "ComponentChildren", + "description": "A single primary action button that's visually emphasized as the most important action in the group.\n\nAccepts a single Button element with a `variant` of `primary`. Can't be used when `gap` is set to `none`.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "readOnly", - "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", - "isOptional": true, - "defaultValue": "false" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "required", - "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", - "isOptional": true, - "defaultValue": "false" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "value", - "value": "string", - "description": "", + "name": "secondaryActions", + "value": "ComponentChildren", + "description": "One or more secondary action buttons that provide alternative or less prominent actions.\n\nAccepts Button elements with a `variant` of `secondary` or `auto`.", "isOptional": true } ], - "value": "export interface BaseTextFieldProps extends FieldProps {\n /**\n * Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.\n *\n * @default false\n */\n readOnly?: boolean;\n}" + "value": "export interface ButtonGroupJSXProps\n extends Partial,\n Pick {\n /**\n * The buttons that should be grouped together, provided as Button components.\n */\n children?: ComponentChildren;\n /**\n * A single primary action button that's visually emphasized as the most important action in the group.\n *\n * Accepts a single Button element with a `variant` of `primary`. Can't be used when `gap` is set to `none`.\n */\n primaryAction?: ComponentChildren;\n /**\n * One or more secondary action buttons that provide alternative or less prominent actions.\n *\n * Accepts Button elements with a `variant` of `secondary` or `auto`.\n */\n secondaryActions?: ComponentChildren;\n}" } }, - "FieldDecorationProps": { + "CheckboxProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "FieldDecorationProps", - "description": "", + "name": "CheckboxProps", + "description": "Properties for rendering a checkbox that supports checked, unchecked, and indeterminate states for complex selection scenarios.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessory", - "value": "ComponentChildren", - "description": "Additional content to be displayed in the field. Commonly used to display an icon that activates a tooltip providing more information.", + "name": "accessibilityLabel", + "value": "string", + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "icon", - "value": "IconType | AnyString", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "name": "checked", + "value": "boolean", + "description": "Whether the control is active.", "isOptional": true, - "defaultValue": "''" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "prefix", - "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "name": "defaultChecked", + "value": "boolean", + "description": "Whether the control is active by default.", "isOptional": true, - "defaultValue": "''" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "suffix", - "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", - "isOptional": true, - "defaultValue": "''" - } - ], - "value": "export interface FieldDecorationProps {\n /**\n * A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n *\n * This text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.\n *\n * @default ''\n */\n suffix?: string;\n /**\n * A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n *\n * This text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.\n *\n * @default ''\n */\n prefix?: string;\n /**\n * An icon displayed inside the field to provide visual context about the expected input or field purpose.\n * Commonly used for search fields, currency inputs, or to indicate field type.\n * Accepts any icon name from the icon library or a custom string identifier.\n *\n * @default ''\n */\n icon?: IconType | AnyString;\n /**\n * Additional content to be displayed in the field.\n * Commonly used to display an icon that activates a tooltip providing more information.\n */\n accessory?: ComponentChildren;\n}" - } - }, - "NumberConstraintsProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "NumberConstraintsProps", - "description": "", - "isPublicDocs": true, - "members": [ + "name": "defaultIndeterminate", + "value": "boolean", + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered, useful for partial selection scenarios.", + "defaultValue": "false" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "controls", - "value": "'auto' | 'stepper' | 'none'", - "description": "The type of controls displayed in the field.\n\n- `stepper`: displays buttons to increase or decrease the value of the field by the stepping interval defined in the `step` property. Appropriate mouse and [keyboard interactions](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/spinbutton_role#keyboard_interactions) to control the value of the field are enabled.\n- `none`: no controls are displayed and users must input the value manually. Arrow keys and scroll wheels can’t be used either to avoid accidental changes.\n- `auto`: the presence of the controls depends on the surface and context.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "max", - "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "name": "disabled", + "value": "boolean", + "description": "Disables the control, disallowing any interaction.", "isOptional": true, - "defaultValue": "Infinity" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "min", - "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", - "isOptional": true, - "defaultValue": "-Infinity" + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "step", - "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", - "isOptional": true, - "defaultValue": "1" - } - ], - "value": "export interface NumberConstraintsProps {\n /**\n * The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n *\n * Users can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.\n *\n * @default Infinity\n */\n max?: number;\n /**\n * The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n *\n * Users can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.\n *\n * @default -Infinity\n */\n min?: number;\n /**\n * The amount the value can increase or decrease by. This can be an integer or decimal.\n * If a `max` or `min` is specified with `step` when increasing/decreasing the value\n * via the buttons, the final value will always round to the `max` or `min`\n * rather than the closest valid amount.\n *\n * @default 1\n */\n step?: number;\n /**\n * The type of controls displayed in the field.\n *\n * - `stepper`: displays buttons to increase or decrease the value of the field by the stepping interval defined in the `step` property.\n * Appropriate mouse and [keyboard interactions](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/spinbutton_role#keyboard_interactions) to control the value of the field are enabled.\n * - `none`: no controls are displayed and users must input the value manually. Arrow keys and scroll wheels can’t be used either to avoid accidental changes.\n * - `auto`: the presence of the controls depends on the surface and context.\n *\n * @default 'auto'\n */\n controls?: 'auto' | 'stepper' | 'none';\n}" - } - }, - "MinMaxLengthProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "MinMaxLengthProps", - "description": "", - "isPublicDocs": true, - "members": [ + "name": "indeterminate", + "value": "boolean", + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark to represent a partial selection." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxLength", - "value": "number", - "description": "The maximum number of characters allowed in the field.", - "isOptional": true, - "defaultValue": "Infinity" + "name": "label", + "value": "string | ComponentChildren", + "description": "Visual content to use as the control label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minLength", - "value": "number", - "description": "The minimum number of characters required in the field.", - "isOptional": true, - "defaultValue": "0" - } - ], - "value": "export interface MinMaxLengthProps {\n /**\n * The maximum number of characters allowed in the field.\n *\n * @default Infinity\n */\n maxLength?: number;\n /**\n * The minimum number of characters required in the field.\n *\n * @default 0\n */\n minLength?: number;\n}" - } - }, - "BaseSelectableProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "BaseSelectableProps", - "description": "", - "isPublicDocs": true, - "members": [ + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "", + "defaultValue": "'visible'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityLabel", + "name": "name", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "An identifier for the control that is unique within the nearest containing `Form` component.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", + "name": "required", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "isOptional": true, "defaultValue": "false" }, @@ -15204,18 +16586,17 @@ "syntaxKind": "PropertySignature", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\".", - "isOptional": true + "description": "" } ], - "value": "export interface BaseSelectableProps {\n /**\n * A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.\n */\n accessibilityLabel?: string;\n /**\n * Whether the checkbox is disabled, preventing user interaction.\n * Disabled checkboxes appear dimmed and their values aren't submitted with forms.\n *\n * @default false\n */\n disabled?: boolean;\n /**\n * The value submitted with the form when this checkbox is checked.\n * If not specified, the default value is \"on\".\n */\n value?: string;\n}" + "value": "export interface CheckboxProps extends PreactCheckboxProps {\n /**\n * Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark to represent a partial selection.\n */\n indeterminate: Required['indeterminate'];\n /**\n * Whether the checkbox should be in an indeterminate state when it's first rendered, useful for partial selection scenarios.\n */\n defaultIndeterminate: Required['defaultIndeterminate'];\n labelAccessibilityVisibility: Required['labelAccessibilityVisibility'];\n}" } }, - "BaseOptionProps": { + "CheckboxJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseOptionProps", - "description": "", + "name": "CheckboxJSXProps", + "description": "Props for using the checkbox component in JSX with React-style event handlers.", "isPublicDocs": true, "members": [ { @@ -15223,164 +16604,148 @@ "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultSelected", + "name": "checked", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the control is active.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", + "name": "defaultChecked", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the control is active by default.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "selected", + "name": "defaultIndeterminate", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", - "isOptional": true, + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered, useful for partial selection scenarios.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "value", - "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\".", - "isOptional": true - } - ], - "value": "export interface BaseOptionProps extends BaseSelectableProps {\n /**\n * Whether the option is currently selected. Use this for controlled components where you manage the selection state.\n *\n * @default false\n */\n selected?: boolean;\n /**\n * The initial selected state for uncontrolled components. Use this when you want the option to start selected\n * but don't need to control its state afterward.\n *\n * @implementation `defaultSelected` reflects to the `selected` attribute.\n *\n * @default false\n */\n defaultSelected?: boolean;\n}" - } - }, - "BaseCheckableProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "BaseCheckableProps", - "description": "", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "name": "details", + "value": "preact.ComponentChildren", + "description": "", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "checked", + "name": "disabled", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Disables the control, disallowing any interaction.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", - "isOptional": true, - "defaultValue": "'--auto'" + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", + "name": "id", "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultChecked", + "name": "indeterminate", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", - "isOptional": true, - "defaultValue": "false" + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark to represent a partial selection." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", - "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", - "isOptional": true, - "defaultValue": "false" + "name": "label", + "value": "string | ComponentChildren", + "description": "Visual content to use as the control label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", - "isOptional": true + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "", + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "label", + "name": "name", "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state.", + "description": "An identifier for the control that is unique within the nearest containing `Form` component.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "name", - "value": "string", - "description": "The name used to identify this checkbox in form submissions. When the checkbox is checked, its `name` and `value` are included in the form data. Must be unique within the containing form.", + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "onChange", - "value": "(event: Event) => void", - "description": "A callback that is run whenever the control is changed. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the checkbox's checked state changes and it loses focus.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "onInput", - "value": "(event: Event) => void", - "description": "A callback that is run whenever the control is changed. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the checkbox's checked state changes.", "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\".", - "isOptional": true + "description": "" } ], - "value": "export interface BaseCheckableProps\n extends BaseSelectableProps,\n InteractionProps {\n /**\n * The text label displayed next to the checkbox that describes what the checkbox controls.\n * Clicking the label will also toggle the checkbox state.\n */\n label?: string;\n /**\n * Whether the control is currently checked. Use this for controlled components where you manage the checked state.\n *\n * @default false\n */\n checked?: boolean;\n /**\n * The initial checked state for uncontrolled components. Use this when you want the control to start checked\n * but don't need to control its state afterward.\n *\n * @implementation `defaultChecked` reflects to the `checked` attribute.\n *\n * @default false\n */\n defaultChecked?: boolean;\n /**\n * The name used to identify this checkbox in form submissions.\n * When the checkbox is checked, its `name` and `value` are included in the form data.\n * Must be unique within the containing form.\n */\n name?: string;\n /**\n * A callback that is run whenever the control is changed. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n onChange?: (event: Event) => void;\n /**\n * A callback that is run whenever the control is changed. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).\n */\n onInput?: (event: Event) => void;\n}" + "value": "export interface CheckboxJSXProps\n extends Partial>,\n Pick,\n FieldSlotInternalReactProps {\n /**\n * A callback that's triggered when the checkbox's checked state changes and it loses focus.\n */\n onChange?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the checkbox's checked state changes.\n */\n onInput?: ((event: CallbackEvent) => void) | null;\n onBlur?: ((event: CallbackEvent) => void) | null;\n}" } }, - "ChipProps$1": { + "ChoiceProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ChipProps$1", - "description": "", + "name": "ChoiceProps", + "description": "Properties for rendering a single choice within a choice list that can be selected using a radio button or checkbox.", "isPublicDocs": true, "members": [ { @@ -15388,1243 +16753,1084 @@ "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The text label displayed within the chip component, typically representing a selected filter, tag, or removable item.", - "isOptional": true + "name": "defaultSelected", + "value": "boolean", + "description": "Whether the control is active by default.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "color", - "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "name": "disabled", + "value": "boolean", + "description": "Disables the control, disallowing any interaction.", "isOptional": true, - "defaultValue": "'base'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "graphic", - "value": "ComponentChildren", - "description": "The graphic to display inside of the chip.", - "isOptional": true + "name": "selected", + "value": "boolean", + "description": "Whether the control is active.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", + "name": "value", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "The value used in form data when the control is checked.", "isOptional": true } ], - "value": "export interface ChipProps$1 extends GlobalProps {\n /**\n * The text label displayed within the chip component, typically representing a selected filter, tag, or removable item.\n */\n children?: ComponentChildren;\n /**\n * The graphic to display inside of the chip.\n *\n * @implementation Only `s-icon` is supported.\n */\n graphic?: ComponentChildren;\n /**\n * A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.\n */\n accessibilityLabel?: string;\n /**\n * The color emphasis level that controls visual intensity.\n *\n * @default 'base'\n */\n color?: ColorKeyword;\n}" + "value": "export interface ChoiceProps\n extends Required<\n Pick<\n ChoiceProps$1,\n | 'selected'\n | 'defaultSelected'\n | 'disabled'\n | 'accessibilityLabel'\n | 'value'\n >\n > {}" } }, - "AutocompleteProps": { + "ChoiceJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "AutocompleteProps", - "description": "", + "name": "ChoiceJSXProps", + "description": "Properties for using the choice component in JSX with React-style props.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "autocomplete", - "value": "| AutocompleteField\n | `${AutocompleteSection} ${AutocompleteField}`\n | `${AutocompleteGroup} ${AutocompleteField}`\n | `${AutocompleteSection} ${AutocompleteGroup} ${AutocompleteField}`\n | 'on'\n | 'off'", - "description": "A hint about the intended content of the field for browser autofill.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "name": "accessibilityLabel", + "value": "string", + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content that's used as the choice label, extracted as plain text from any provided markup.\n\nThe label is produced by extracting and concatenating the text nodes from the provided content; any markup or element structure is ignored.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultSelected", + "value": "boolean", + "description": "Whether the control is active by default.", "isOptional": true, - "defaultValue": "'on' for everything else" - } - ], - "value": "export interface AutocompleteProps<\n AutocompleteField extends AnyAutocompleteField,\n> {\n /**\n * A hint about the intended content of the field for browser autofill.\n *\n * When set to `on` (the default), this property indicates that the field should support\n * autofill, but you do not have any more semantic information on the intended\n * contents.\n *\n * When set to `off`, you are indicating that this field contains sensitive\n * information, or contents that are never saved, like one-time codes.\n *\n * Alternatively, you can provide value which describes the\n * specific data you would like to be entered into this field during autofill.\n *\n * Learn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.\n *\n * @default 'tel' for PhoneField\n * @default 'email' for EmailField\n * @default 'url' for URLField\n * @default 'on' for everything else\n */\n autocomplete?:\n | AutocompleteField\n | `${AutocompleteSection} ${AutocompleteField}`\n | `${AutocompleteGroup} ${AutocompleteField}`\n | `${AutocompleteSection} ${AutocompleteGroup} ${AutocompleteField}`\n | 'on'\n | 'off';\n}" - } - }, - "AutocompleteSection": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "AutocompleteSection", - "value": "`section-${string}`", - "description": "The “section” scopes the autocomplete data that should be inserted to a specific area of the page.\n\nCommonly used when there are multiple fields with the same autocomplete needs in the same page. For example: 2 shipping address forms in the same page.", - "isPublicDocs": true - } - }, - "AutocompleteGroup": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "AutocompleteGroup", - "value": "'shipping' | 'billing'", - "description": "The contact information group the autocomplete data should be sourced from.", - "isPublicDocs": true - } - }, - "AutocompleteAddressGroup": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "AutocompleteAddressGroup", - "value": "'fax' | 'home' | 'mobile' | 'pager'", - "description": "The contact information subgroup the autocomplete data should be sourced from.", - "isPublicDocs": true - } - }, - "AnyAutocompleteField": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "AnyAutocompleteField", - "value": "'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'current-password' | 'email' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'language' | 'name' | 'new-password' | 'nickname' | 'one-time-code' | 'organization-title' | 'organization' | 'photo' | 'postal-code' | 'sex' | 'street-address' | 'transaction-amount' | 'transaction-currency' | 'url' | 'username' | 'bday-day' | 'bday-month' | 'bday-year' | 'bday' | 'cc-additional-name' | 'cc-expiry-month' | 'cc-expiry-year' | 'cc-expiry' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-number' | 'cc-csc' | 'cc-type' | `${AutocompleteAddressGroup} email` | 'impp' | `${AutocompleteAddressGroup} impp` | 'tel' | 'tel-area-code' | 'tel-country-code' | 'tel-extension' | 'tel-local-prefix' | 'tel-local-suffix' | 'tel-local' | 'tel-national' | `${AutocompleteAddressGroup} tel` | `${AutocompleteAddressGroup} tel-area-code` | `${AutocompleteAddressGroup} tel-country-code` | `${AutocompleteAddressGroup} tel-extension` | `${AutocompleteAddressGroup} tel-local-prefix` | `${AutocompleteAddressGroup} tel-local-suffix` | `${AutocompleteAddressGroup} tel-local` | `${AutocompleteAddressGroup} tel-national`", - "description": "Represents all possible autocomplete field values as defined by the HTML autocomplete specification. These values help browsers provide appropriate autofill suggestions for form fields.\n\nLearn more about [autocomplete values](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete).", - "isPublicDocs": true - } - }, - "FunctionSettingsError": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "FunctionSettingsError", - "description": "Represents an error that occurs when saving function settings data.\n\nThese errors are returned when the extension-provided data fails validation or causes issues during the commit process to Shopify's servers. Handle these errors in the `onError` callback to provide feedback to users about what went wrong.", - "isPublicDocs": true, - "members": [ + "defaultValue": "false" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "code", - "value": "string", - "description": "A unique identifier describing the “class” of error. These will match the GraphQL error codes as closely as possible. For example the enums returned by the `metafieldsSet` mutation.\n\nLearn more about [MetafieldsSetUserErrorCode](https://shopify.dev/docs/api/admin-graphql/latest/enums/MetafieldsSetUserErrorCode)." + "name": "details", + "value": "ComponentChildren", + "description": "Additional text that provides context or guidance for the input, displayed alongside the choice label.\n\nThis text is displayed along with the input and its label to offer more information or instructions to the user.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "message", + "name": "disabled", + "value": "boolean", + "description": "Disables the control, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", "value": "string", - "description": "" + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "name", - "value": "'FunctionSettingsError'", - "description": "The error type name, always set to `FunctionSettingsError`.\n\nThis helps identify errors specific to function settings, distinguishing them from other error types." + "name": "secondaryContent", + "value": "ComponentChildren", + "description": "Additional content to display below the choice label. Can include rich content like TextFields, Buttons, or other interactive components. Event handlers on React components are preserved.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "stack", + "name": "selected", + "value": "boolean", + "description": "Whether the control is active.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", "value": "string", - "description": "", + "description": "The value used in form data when the control is checked.", "isOptional": true } ], - "value": "export interface FunctionSettingsError extends Error {\n /**\n * A unique identifier describing the “class” of error. These will match\n * the GraphQL error codes as closely as possible. For example the enums\n * returned by the `metafieldsSet` mutation.\n *\n * Learn more about [MetafieldsSetUserErrorCode](https://shopify.dev/docs/api/admin-graphql/latest/enums/MetafieldsSetUserErrorCode).\n */\n code: string;\n /**\n * The error type name, always set to `FunctionSettingsError`.\n *\n * This helps identify errors specific to function settings, distinguishing them from other error types.\n */\n name: 'FunctionSettingsError';\n}" + "value": "export interface ChoiceJSXProps\n extends Partial,\n Pick {\n /**\n * The content that's used as the choice label, extracted as plain text from any provided markup.\n *\n * The label is produced by extracting and concatenating the text nodes from the provided content; any markup or element structure is ignored.\n */\n children?: ComponentChildren;\n /**\n * Additional text that provides context or guidance for the input, displayed alongside the choice label.\n *\n * This text is displayed along with the input and its label to offer more information or instructions to the user.\n *\n * @implementation this content should be linked to the input with an `aria-describedby` attribute.\n */\n details?: ComponentChildren;\n /**\n * Additional content to display below the choice label.\n * Can include rich content like TextFields, Buttons, or other interactive components.\n * Event handlers on React components are preserved.\n */\n secondaryContent?: ComponentChildren;\n}" } }, - "BaseTypographyProps": { + "ChoiceListProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseTypographyProps", - "description": "", + "name": "ChoiceListProps", + "description": "Properties for rendering a list of choices that lets users select one or more options using radio buttons or checkboxes.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "color", - "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.\n\n`disabled` on any child choices is ignored when this is true.", "isOptional": true, - "defaultValue": "'base'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "dir", - "value": "'ltr' | 'rtl' | 'auto' | ''", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "''" + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "fontVariantNumeric", - "value": "'auto' | 'normal' | 'tabular-nums'", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "multiple", + "value": "boolean", + "description": "Whether multiple choices can be selected.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "lang", + "name": "name", "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation.\n\nThe value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry).\n\nIt is recommended to combine it with the `dir` attribute to ensure the text is rendered correctly if the surrounding content’s direction is different.", - "isOptional": true, - "defaultValue": "''" + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "tone", - "value": "ToneKeyword", - "description": "The semantic meaning and color treatment of the component.\n\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `caution`: Advisory notices that need attention.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `accent`: Highlighted or promotional content.\n- `custom`: Custom styling controlled by your theme.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "values", + "value": "string[]", + "description": "An array of the `value`s of the selected options.\n\nThis is a convenience prop for setting the `selected` prop on child options.", + "isOptional": true } ], - "value": "export interface BaseTypographyProps {\n /**\n * The color emphasis level that controls visual intensity.\n *\n * - `base`: Primary color for body text, standard UI elements, and general content with good readability.\n * - `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n *\n * @default 'base'\n */\n color?: ColorKeyword;\n /**\n * The semantic meaning and color treatment of the component.\n *\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent.\n * - `info`: Informational content or helpful tips.\n * - `success`: Positive outcomes or successful states.\n * - `caution`: Advisory notices that need attention.\n * - `warning`: Important warnings about potential issues.\n * - `critical`: Urgent problems or destructive actions.\n * - `accent`: Highlighted or promotional content.\n * - `custom`: Custom styling controlled by your theme.\n *\n * @default 'auto'\n */\n tone?: ToneKeyword;\n /**\n * The rendering style for numbers in the font.\n *\n * - `auto`: Inherits the setting from the parent element.\n * - `normal`: Uses the font's default numeric glyphs.\n * - `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n *\n * Learn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).\n *\n * @default 'auto'\n */\n fontVariantNumeric?: 'auto' | 'normal' | 'tabular-nums';\n /**\n * The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation.\n *\n * The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry).\n *\n * It is recommended to combine it with the `dir` attribute to ensure the text is rendered correctly if the surrounding content’s direction is different.\n *\n * @default ''\n */\n lang?: string;\n /**\n * Indicates the directionality of the element’s text.\n *\n * - `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n * - `auto`: The user agent determines the direction based on the content.\n * - `ltr`: The languages written from left to right (such as English).\n * - `rtl`: The languages written from right to left (such as Arabic).\n *\n * Learn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).\n *\n * @default ''\n */\n dir?: 'ltr' | 'rtl' | 'auto' | '';\n}" + "value": "export interface ChoiceListProps\n extends Required<\n Pick<\n ChoiceListProps$1,\n | 'details'\n | 'disabled'\n | 'error'\n | 'label'\n | 'labelAccessibilityVisibility'\n | 'multiple'\n | 'name'\n | 'values'\n >\n > {}" } }, - "BlockTypographyProps": { + "ChoiceListJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BlockTypographyProps", - "description": "", + "name": "ChoiceListJSXProps", + "description": "Properties for using the choice list component in JSX with React-style event handlers.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "lineClamp", - "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", - "isOptional": true, - "defaultValue": "Infinity - no truncation is applied" - } - ], - "value": "export interface BlockTypographyProps {\n /**\n * The maximum number of lines to display before truncating the text content.\n *\n * Learn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).\n *\n * @default Infinity - no truncation is applied\n */\n lineClamp?: number;\n}" - } - }, - "BaseImageProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "BaseImageProps", - "description": "", - "isPublicDocs": true, - "members": [ + "name": "children", + "value": "ComponentChildren", + "description": "The choices that a user can select from, provided as Choice components.\n\nAccepts Choice components.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "alt", - "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.\n\n`disabled` on any child choices is ignored when this is true.", "isOptional": true, - "defaultValue": "``" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "sizes", - "value": "string", - "description": "A set of media conditions and their corresponding sizes.\n\nLearn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes).", + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "src", + "name": "id", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered.", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "srcSet", - "value": "string", - "description": "A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n\nLearn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset).", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", "isOptional": true - } - ], - "value": "export interface BaseImageProps {\n /**\n * Alternative text that describes the image for accessibility.\n *\n * Provides a text description of the image for users with assistive technology\n * and serves as a fallback when the image fails to load. A well-written description\n * enables people with visual impairments to understand non-text content.\n *\n * When a screen reader encounters an image, it reads this description aloud.\n * When an image fails to load, this text displays on screen, helping all users\n * understand what content was intended.\n *\n * Learn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4)\n * and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).\n *\n * @default ``\n */\n alt?: string;\n /**\n * A set of media conditions and their corresponding sizes.\n *\n * Learn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes).\n */\n sizes?: string;\n /**\n * The image source (either a remote URL or a local file resource).\n *\n * When the image is loading or no `src` is provided, a placeholder is rendered.\n *\n * @implementation Surfaces may choose the style of the placeholder, but the space the image occupies should be\n * reserved, except in cases where the image area does not have a contextual inline or block size, which should be rare.\n *\n * Learn more about the [src attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#src).\n */\n src?: string;\n /**\n * A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n *\n * Learn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset).\n */\n srcSet?: string;\n}" - } - }, - "MoneyAutocompleteField": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "MoneyAutocompleteField", - "value": "'transaction-amount'", - "description": "Represents autocomplete values that are valid for money/currency input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for monetary inputs.", - "isPublicDocs": true - } - }, - "ParagraphType": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ParagraphType", - "value": "'paragraph' | 'small'", - "description": "", - "isPublicDocs": true - } - }, - "PaginationProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "PaginationProps", - "description": "", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "hasNextPage", - "value": "boolean", - "description": "Whether there's an additional page of data.", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "hasPreviousPage", + "name": "multiple", "value": "boolean", - "description": "Whether there's a previous page of data.", + "description": "Whether multiple choices can be selected.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "loading", - "value": "boolean", - "description": "Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table. When `true`, the table might be in an inert state that prevents user interaction.", - "isOptional": true, - "defaultValue": "false" + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onNextPage", - "value": "(event: Event) => void", - "description": "A callback fired when the next page button is clicked.", + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the selected choices change and the choice list loses focus.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onPreviousPage", - "value": "(event: Event) => void", - "description": "A callback fired when the previous page button is clicked.", + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the selected choices change as the user interacts with them.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paginate", - "value": "boolean", - "description": "Whether to use pagination controls.", - "isOptional": true, - "defaultValue": "false" + "name": "values", + "value": "string[]", + "description": "An array of the `value`s of the selected options.\n\nThis is a convenience prop for setting the `selected` prop on child options.", + "isOptional": true } ], - "value": "export interface PaginationProps {\n /**\n * Whether to use pagination controls.\n *\n * @default false\n */\n paginate?: boolean;\n /**\n * A callback fired when the previous page button is clicked.\n */\n onPreviousPage?: (event: Event) => void;\n /**\n * A callback fired when the next page button is clicked.\n */\n onNextPage?: (event: Event) => void;\n /**\n * Whether there's an additional page of data.\n *\n * @default false\n */\n hasNextPage?: boolean;\n /**\n * Whether there's a previous page of data.\n *\n * @default false\n */\n hasPreviousPage?: boolean;\n /**\n * Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table.\n * When `true`, the table might be in an inert state that prevents user interaction.\n *\n * @default false\n */\n loading?: boolean;\n}" + "value": "export interface ChoiceListJSXProps\n extends Partial,\n Pick {\n /**\n * The choices that a user can select from, provided as Choice components.\n *\n * Accepts Choice components.\n */\n children?: ComponentChildren;\n /**\n * A callback that's triggered when the selected choices change and the choice list loses focus.\n */\n onChange?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the selected choices change as the user interacts with them.\n */\n onInput?: ((event: CallbackEvent) => void) | null;\n}" } }, - "TextType": { + "ClickableBaseProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", - "name": "TextType", - "value": "'address' | 'redundant' | 'mark' | 'emphasis' | 'offset' | 'strong' | 'small' | 'generic'", - "description": "Defines the semantic type and styling treatment for text content. Each type maps to appropriate HTML elements and applies specific styling for different contexts.", - "isPublicDocs": true - } - }, - "Key": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "Key", - "value": "string | number | any", - "description": "Represents a unique key for identifying elements in lists. Can be a string, number, or any other value.", - "isPublicDocs": true - } - }, - "RefCallback": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "RefCallback", - "description": "Represents a callback function that receives a reference to a DOM element or component instance. Called when the element is mounted or unmounted.", - "isPublicDocs": true, - "params": [ - { - "name": "instance", - "description": "", - "value": "T", - "filePath": "src/surfaces/admin/components.ts" - } - ], - "returns": { - "filePath": "src/surfaces/admin/components.ts", - "description": "", - "name": "void", - "value": "void" - }, - "value": "(instance: T | null) => void" - } - }, - "Ref": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "Ref", - "value": "RefObject | RefCallback | null", - "description": "Represents a reference to a DOM element or component instance. Can be either a ref object, callback function, or null.", - "isPublicDocs": true - } - }, - "RefObject": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "RefObject", + "name": "ClickableBaseProps", + "value": "Required<\n Pick<\n ClickableProps$1,\n | 'command'\n | 'commandFor'\n | 'interestFor'\n | 'disabled'\n | 'download'\n | 'href'\n | 'lang'\n | 'loading'\n | 'overflow'\n | 'target'\n | 'type'\n >\n>", "description": "", + "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "current", - "value": "T | null", - "description": "The current value of the ref, which holds a reference to the DOM element or component instance. Will be `null` if the element is not yet mounted or has been unmounted." - } - ], - "value": "export interface RefObject {\n /**\n * The current value of the ref, which holds a reference to the DOM element or component instance.\n * Will be `null` if the element is not yet mounted or has been unmounted.\n */\n current: T | null;\n}" - } - }, - "ComponentChild": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ComponentChild", - "value": "VNode | object | string | number | bigint | boolean | null | undefined", - "description": "Represents a single child element that can be rendered, including VNodes, primitives, or null/undefined values.", - "isPublicDocs": true - } - }, - "VNode": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "VNode", - "description": "", - "members": [ + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "endTime", - "value": "number", - "description": "The time that the rendering of this `vnode` was completed. Will only be set when the devtools are attached. Default value: `-1`", + "name": "commandFor", + "value": "string", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "key", - "value": "Key", - "description": "A unique key used to identify this element in lists for efficient reconciliation." + "name": "disabled", + "value": "boolean", + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "props", - "value": "P & { children: ComponentChildren$1; }", - "description": "The properties passed to this component or element, including children." + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "ref", - "value": "Ref | null", - "description": "A ref to the element, which is not guaranteed by React.ReactElement. For compatibility reasons with popular react libs we define it as optional too.", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "startTime", - "value": "number", - "description": "The time this `vnode` started rendering. Will only be set when the devtools are attached. Default value: `0`", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "loading", + "value": "boolean", + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "target", + "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", + "description": "Specifies where to display the linked URL.", + "isOptional": true, + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "type", - "value": "ComponentType

| string", - "description": "The component type or HTML element tag name that this VNode represents." + "value": "'submit' | 'button' | 'reset'", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "isOptional": true, + "defaultValue": "'button'" } - ], - "value": "export interface VNode

{\n /**\n * The component type or HTML element tag name that this VNode represents.\n */\n type: ComponentType

| string;\n /**\n * The properties passed to this component or element, including children.\n */\n props: P & {\n children: ComponentChildren$1;\n };\n /**\n * A unique key used to identify this element in lists for efficient reconciliation.\n */\n key: Key;\n /**\n * A ref to the element, which is not guaranteed by React.ReactElement. For compatibility reasons with popular react libs we define it as optional too.\n */\n ref?: Ref | null;\n /**\n * The time this `vnode` started rendering. Will only be set when\n * the devtools are attached.\n * Default value: `0`\n */\n startTime?: number;\n /**\n * The time that the rendering of this `vnode` was completed. Will only be\n * set when the devtools are attached.\n * Default value: `-1`\n */\n endTime?: number;\n}" - } - }, - "ComponentType": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ComponentType", - "value": "ComponentClass

| FunctionComponent

", - "description": "Represents any valid component type, either a class component or a function component.", - "isPublicDocs": true + ] } }, - "ComponentClass": { + "ClickableProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ComponentClass", - "description": "", + "name": "ClickableProps", + "description": "The properties for the clickable component. These properties define a low-level interactive container element that responds to user clicks while inheriting all box styling capabilities. The component serves as a foundation for building custom interactive components.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "contextType", - "value": "Context", - "description": "The context type this component can consume. When set, the component will have access to this context's value.", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultProps", - "value": "Partial

", - "description": "The default values for props that will be used when props are not explicitly provided to component instances.", - "isOptional": true + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "displayName", - "value": "string", - "description": "A human-readable name for this component class, used in debugging and dev tools.", - "isOptional": true + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "getDerivedStateFromError", - "value": "(error: any) => Partial", - "description": "", - "isOptional": true + "syntaxKind": "PropertySignature", + "name": "background", + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", + "defaultValue": "'transparent'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "getDerivedStateFromProps", - "value": "(props: Readonly

, state: Readonly) => Partial", - "description": "", - "isOptional": true - } - ], - "value": "export interface ComponentClass

{\n new (props: P, context?: any): Component;\n /**\n * A human-readable name for this component class, used in debugging and dev tools.\n */\n displayName?: string;\n /**\n * The default values for props that will be used when props are not explicitly provided to component instances.\n */\n defaultProps?: Partial

;\n /**\n * The context type this component can consume. When set, the component will have access to this context's value.\n */\n contextType?: Context;\n getDerivedStateFromProps?(\n props: Readonly

,\n state: Readonly,\n ): Partial | null;\n getDerivedStateFromError?(error: any): Partial | null;\n}" - } - }, - "Context": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Context", - "description": "", - "isPublicDocs": true, - "members": [ + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "Consumer", - "value": "Consumer", - "description": "A component that consumes the context value and re-renders when it changes." + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultProps", - "value": "Partial

| undefined", - "description": "The default values for props that will be used when props are not explicitly provided.", - "isOptional": true + "name": "borderColor", + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultValue", - "value": "T", - "description": "The default value for this context, used when no Provider is found in the component tree." + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "displayName", - "value": "string", - "description": "A human-readable name for this context, used in debugging and dev tools.", - "isOptional": true + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "Provider", - "value": "Provider", - "description": "A component that provides the context value to its descendants." - } - ], - "value": "export interface Context {\n /**\n * The default value for this context, used when no Provider is found in the component tree.\n */\n readonly defaultValue: T;\n}" - } - }, - "Consumer": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Consumer", - "description": "", - "members": [ + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", + "defaultValue": "'' - meaning no override" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultProps", - "value": "Partial

| undefined", - "description": "The default values for props that will be used when props are not explicitly provided.", - "isOptional": true + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "displayName", + "name": "commandFor", "value": "string", - "description": "A human-readable name for this component, used in debugging and dev tools.", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", "isOptional": true - } - ], - "value": "export interface Consumer\n extends FunctionComponent<{\n /**\n * A render function that receives the current context value and returns elements to render.\n * This function is called whenever the context value changes, allowing components to re-render with the updated value.\n */\n children: (value: T) => ComponentChildren$1;\n }> {}" - } - }, - "Provider": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Provider", - "description": "", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultProps", - "value": "Partial

| undefined", - "description": "The default values for props that will be used when props are not explicitly provided.", - "isOptional": true + "name": "disabled", + "value": "boolean", + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "displayName", + "name": "display", + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "download", "value": "string", - "description": "A human-readable name for this component, used in debugging and dev tools.", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", "isOptional": true - } - ], - "value": "export interface Provider\n extends FunctionComponent<{\n /**\n * The context value to provide to consuming components.\n */\n value: T;\n /**\n * The child components that will have access to this context value.\n */\n children?: ComponentChildren$1;\n }> {}" - } - }, - "FunctionComponent": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "FunctionComponent", - "description": "", - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultProps", - "value": "Partial

| undefined", - "description": "The default values for props that will be used when props are not explicitly provided.", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "displayName", + "name": "inlineSize", + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", "value": "string", - "description": "A human-readable name for this component, used in debugging and dev tools.", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true - } - ], - "value": "export interface FunctionComponent

{\n (props: RenderableProps

, context?: any): ComponentChildren$1;\n /**\n * A human-readable name for this component, used in debugging and dev tools.\n */\n displayName?: string;\n /**\n * The default values for props that will be used when props are not explicitly provided.\n */\n defaultProps?: Partial

| undefined;\n}" - } - }, - "ErrorInfo": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ErrorInfo", - "description": "", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "componentStack", + "name": "lang", "value": "string", - "description": "A string representation of the component stack trace at the point where an error occurred. Useful for debugging to understand which components were rendering when the error happened.", - "isOptional": true - } - ], - "value": "export interface ErrorInfo {\n /**\n * A string representation of the component stack trace at the point where an error occurred.\n * Useful for debugging to understand which components were rendering when the error happened.\n */\n componentStack?: string;\n}" - } - }, - "RenderableProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RenderableProps", - "value": "P & Readonly<\n Attributes & {\n /**\n * The child elements to be rendered within this component.\n */\n children?: ComponentChildren$1;\n /**\n * A reference to the DOM element or component instance, allowing direct access to the underlying element.\n */\n ref?: Ref;\n }\n >", - "description": "Represents the props that can be rendered by a component, combining custom props with standard attributes like children and ref.", - "isPublicDocs": true - } - }, - "Attributes": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Attributes", - "description": "", - "members": [ + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", + "isOptional": true, + "defaultValue": "''" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "jsx", - "value": "boolean | undefined", - "description": "An internal flag indicating whether this element was created using JSX syntax.", - "isOptional": true + "name": "loading", + "value": "boolean", + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "key", - "value": "Key | undefined", - "description": "A unique key used to identify this element in lists for efficient reconciliation during re-renders.", - "isOptional": true - } - ], - "value": "export interface Attributes {\n /**\n * A unique key used to identify this element in lists for efficient reconciliation during re-renders.\n */\n key?: Key | undefined;\n /**\n * An internal flag indicating whether this element was created using JSX syntax.\n */\n jsx?: boolean | undefined;\n}" - } - }, - "Component": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Component", - "description": "", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "state", - "value": "Readonly", - "description": "The current state of the component." + "name": "maxBlockSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "props", - "value": "RenderableProps", - "description": "The props passed to this component." + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "context", - "value": "any", - "description": "The context value this component can access if a contextType is specified." + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "base", - "value": "Element | Text", - "description": "The underlying DOM element or text node that this component rendered." + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setState", - "value": "(state: Partial | ((prevState: Readonly, props: Readonly

) => Partial | Pick) | Pick, callback?: () => void) => void", - "description": "" + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "forceUpdate", - "value": "(callback?: () => void) => void", - "description": "" + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "MaybeResponsive>", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "render", - "value": "(props?: RenderableProps, state?: Readonly, context?: any) => ComponentChildren$1", - "description": "" - } - ], - "value": "declare abstract class Component {\n constructor(props?: P, context?: any);\n static displayName?: string;\n static defaultProps?: any;\n static contextType?: Context;\n // Static members cannot reference class type parameters. This is not\n // supported in TypeScript. Reusing the same type arguments from `Component`\n // will lead to an impossible state where one cannot satisfy the type\n // constraint under no circumstances, see #1356.In general type arguments\n // seem to be a bit buggy and not supported well at the time of this\n // writing with TS 3.3.3333.\n static getDerivedStateFromProps?(\n props: Readonly,\n state: Readonly,\n ): object | null;\n\n static getDerivedStateFromError?(error: any): object | null;\n /**\n * The current state of the component.\n */\n state: Readonly;\n /**\n * The props passed to this component.\n */\n props: RenderableProps

;\n /**\n * The context value this component can access if a contextType is specified.\n */\n context: any;\n /**\n * The underlying DOM element or text node that this component rendered.\n */\n base?: Element | Text;\n // From https://github.com/DefinitelyTyped/DefinitelyTyped/blob/e836acc75a78cf0655b5dfdbe81d69fdd4d8a252/types/react/index.d.ts#L402\n // // We MUST keep setState() as a unified signature because it allows proper checking of the method return type.\n // // See: https://github.com/DefinitelyTyped/DefinitelyTyped/issues/18365#issuecomment-351013257\n setState(\n state:\n | ((\n prevState: Readonly,\n props: Readonly

,\n ) => Pick | Partial | null)\n | (Pick | Partial | null),\n callback?: () => void,\n ): void;\n\n forceUpdate(callback?: () => void): void;\n abstract render(\n props?: RenderableProps

,\n state?: Readonly,\n context?: any,\n ): ComponentChildren$1;\n}" - } - }, - "Styles": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "Styles", - "value": "string", - "description": "Represents CSS styles as a string, typically used for inline styles or style injection.", - "isPublicDocs": true - } - }, - "RenderImpl": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RenderImpl", - "value": "Omit & {\n ShadowRoot: (element: any) => ComponentChildren;\n styles?: Styles;\n}", - "description": "Represents the implementation details for rendering components within a shadow DOM. Extends `ShadowRootInit` with a render function and optional styles.", - "isPublicDocs": true - } - }, - "CallbackEvent": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "CallbackEvent", - "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true - } - }, - "CallbackToggleEvent": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "CallbackToggleEvent", - "value": "TEvent & {\n currentTarget: HTMLElementTagNameMap[TTagName];\n}", - "description": "A toggle event with a strongly-typed `currentTarget` property. Extends the `ToggleEvent` interface with type-safe access to the element that triggered the toggle.", - "isPublicDocs": true - } - }, - "CallbackEventListener": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "CallbackEventListener", - "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true - } - }, - "CallbackErrorEventListener": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "CallbackErrorEventListener", - "value": "(EventListener & {\n (\n event: CallbackEvent & {\n error: TError;\n },\n ): void;\n }) | null", - "description": "A function that handles error events from UI components. This type represents an event listener callback that receives both the event and an error object.", - "isPublicDocs": true - } - }, - "CallbackExtendableEventListener": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "CallbackExtendableEventListener", - "value": "(EventListener & {\n (event: CallbackExtendableEvent): void;\n }) | null", - "description": "A function that handles extendable events from UI components. This type represents an event listener callback that can use `waitUntil` to extend the event lifetime.", - "isPublicDocs": true - } - }, - "CallbackExtendableEvent": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "CallbackExtendableEvent", - "description": "", - "members": [ + "syntaxKind": "PropertySignature", + "name": "paddingBlock", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "AT_TARGET", - "value": "2", - "description": "" + "name": "paddingBlockEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "bubbles", - "value": "boolean", - "description": "The **`bubbles`** read-only property of the Event interface indicates whether the event bubbles up through the DOM tree or not.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/bubbles)" + "name": "paddingBlockStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "BUBBLING_PHASE", - "value": "3", - "description": "" + "name": "paddingInline", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "cancelable", - "value": "boolean", - "description": "The **`cancelable`** read-only property of the Event interface indicates whether the event can be canceled, and therefore prevented as if the event never happened.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelable)" + "name": "paddingInlineEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "cancelBubble", - "value": "boolean", - "description": "The **`cancelBubble`** property of the Event interface is deprecated.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelBubble)" + "name": "paddingInlineStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "CAPTURING_PHASE", - "value": "1", - "description": "" + "name": "target", + "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", + "description": "Specifies where to display the linked URL.", + "isOptional": true, + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "composed", - "value": "boolean", - "description": "The read-only **`composed`** property of the or not the event will propagate across the shadow DOM boundary into the standard DOM.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composed)" - }, + "name": "type", + "value": "'submit' | 'button' | 'reset'", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "isOptional": true, + "defaultValue": "'button'" + } + ], + "value": "export interface ClickableProps\n extends Required,\n ClickableBaseProps {}" + } + }, + "ClickableJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ClickableJSXProps", + "description": "The JSX properties for the clickable component. These properties define how a clickable container is rendered in Preact or JSX.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "composedPath", - "value": "() => EventTarget[]", - "description": "The **`composedPath()`** method of the Event interface returns the event's path which is an array of the objects on which listeners will be invoked.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composedPath)" + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "currentTarget", - "value": "EventTarget | null", - "description": "The **`currentTarget`** read-only property of the Event interface identifies the element to which the event handler has been attached.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/currentTarget)" + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultPrevented", - "value": "boolean", - "description": "The **`defaultPrevented`** read-only property of the Event interface returns a boolean value indicating whether or not the call to Event.preventDefault() canceled the event.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/defaultPrevented)" + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "eventPhase", - "value": "number", - "description": "The **`eventPhase`** read-only property of the being evaluated.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/eventPhase)" + "name": "background", + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", + "defaultValue": "'transparent'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "initEvent", - "value": "(type: string, bubbles?: boolean, cancelable?: boolean) => void", - "description": "The **`Event.initEvent()`** method is used to initialize the value of an event created using Document.createEvent().", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/initEvent)" + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "isTrusted", - "value": "boolean", - "description": "The **`isTrusted`** read-only property of the when the event was generated by the user agent (including via user actions and programmatic methods such as HTMLElement.focus()), and `false` when the event was dispatched via The only exception is the `click` event, which initializes the `isTrusted` property to `false` in user agents.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/isTrusted)" + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "NONE", - "value": "0", - "description": "" + "name": "borderColor", + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "preventDefault", - "value": "() => void", - "description": "The **`preventDefault()`** method of the Event interface tells the user agent that if the event does not get explicitly handled, its default action should not be taken as it normally would be.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/preventDefault)" + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "returnValue", - "value": "boolean", - "description": "The Event property **`returnValue`** indicates whether the default action for this event has been prevented or not.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/returnValue)" + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "srcElement", - "value": "EventTarget | null", - "description": "The deprecated **`Event.srcElement`** is an alias for the Event.target property.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/srcElement)" + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "stopImmediatePropagation", - "value": "() => void", - "description": "The **`stopImmediatePropagation()`** method of the If several listeners are attached to the same element for the same event type, they are called in the order in which they were added.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopImmediatePropagation)" + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content to display inside the component. This can include text, components, or any other UI elements.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "stopPropagation", - "value": "() => void", - "description": "The **`stopPropagation()`** method of the Event interface prevents further propagation of the current event in the capturing and bubbling phases.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopPropagation)" + "syntaxKind": "PropertySignature", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "target", - "value": "EventTarget | null", - "description": "The read-only **`target`** property of the dispatched.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/target)" + "name": "commandFor", + "value": "string", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "timeStamp", - "value": "DOMHighResTimeStamp", - "description": "The **`timeStamp`** read-only property of the Event interface returns the time (in milliseconds) at which the event was created.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/timeStamp)" + "name": "disabled", + "value": "boolean", + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "type", - "value": "string", - "description": "The **`type`** read-only property of the Event interface returns a string containing the event's type.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/type)" + "name": "display", + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "waitUntil", - "value": "(promise: Promise) => void", - "description": "A method that accepts a promise signaling the duration and eventual success or failure of event-related actions.\n\nCan be called multiple times to add promises to the event, but must be called synchronously during event dispatch. Cannot be called after a `setTimeout` or within a microtask.", + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", "isOptional": true - } - ], - "value": "export interface CallbackExtendableEvent<\n TTagName extends keyof HTMLElementTagNameMap,\n> extends CallbackEvent,\n Pick {}" - } - }, - "PreactBaseElementProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "PreactBaseElementProps", - "description": "Base props for Preact custom elements without children support. Includes common properties like key, ref, and slot for elements that don't accept child content.", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "key", - "value": "preact.Key", - "description": "A unique identifier for this element, used by the virtual DOM to efficiently track and update elements in lists. Essential for maintaining component state and optimizing re-renders when lists change.", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "ref", - "value": "preact.Ref", - "description": "A reference to access the underlying DOM element directly. Typically created using `useRef()` to interact with the element imperatively or measure its properties.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "slot", - "value": "Lowercase", - "description": "The named slot to which this element is assigned in the parent component's shadow DOM.\n\nUsed for advanced component composition with web components.", - "isOptional": true - } - ], - "value": "export interface PreactBaseElementProps {\n /**\n * A unique identifier for this element, used by the virtual DOM to efficiently track and update elements in lists.\n * Essential for maintaining component state and optimizing re-renders when lists change.\n */\n key?: preact.Key;\n /**\n * A reference to access the underlying DOM element directly.\n * Typically created using `useRef()` to interact with the element imperatively or measure its properties.\n */\n ref?: preact.Ref;\n /**\n * The named slot to which this element is assigned in the parent component's shadow DOM.\n *\n * Used for advanced component composition with web components.\n */\n slot?: Lowercase;\n}" - } - }, - "PreactBaseElementPropsWithChildren": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "PreactBaseElementPropsWithChildren", - "description": "Base props for Preact custom elements with children support. Extends PreactBaseElementProps with the ability to render child elements.", - "isPublicDocs": true, - "members": [ + "name": "inlineSize", + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "preact.ComponentChildren", - "description": "The child elements to be rendered within this component.", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "key", - "value": "preact.Key", - "description": "A unique identifier for this element, used by the virtual DOM to efficiently track and update elements in lists. Essential for maintaining component state and optimizing re-renders when lists change.", - "isOptional": true + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", + "isOptional": true, + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "ref", - "value": "preact.Ref", - "description": "A reference to access the underlying DOM element directly. Typically created using `useRef()` to interact with the element imperatively or measure its properties.", - "isOptional": true + "name": "loading", + "value": "boolean", + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "slot", - "value": "Lowercase", - "description": "The named slot to which this element is assigned in the parent component's shadow DOM.\n\nUsed for advanced component composition with web components.", + "name": "maxBlockSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback function that's invoked when the component loses focus. It receives the blur event as an argument.", "isOptional": true - } - ], - "value": "export interface PreactBaseElementPropsWithChildren\n extends PreactBaseElementProps {\n /**\n * The child elements to be rendered within this component.\n */\n children?: preact.ComponentChildren;\n}" - } - }, - "RequiredBannerProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RequiredBannerProps", - "value": "Required", - "description": "Represents the banner component props with all properties marked as required.", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The main message content displayed within the banner, providing important information or guidance to users.", + "name": "onClick", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback function that's invoked when the component is clicked. It receives the click event as an argument.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "collapsible", - "value": "boolean", - "description": "Whether the banner content can be collapsed. When true, child elements are initially hidden but can be revealed by the user expanding the banner.", - "isOptional": true, - "defaultValue": "false" + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback function that's invoked when the component receives focus. It receives the focus event as an argument.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "dismissible", - "value": "boolean", - "description": "Whether the banner displays a close button that allows users to dismiss it.\n\nWhen the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, any animation completes, and the `afterhide` event fires.", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "heading", - "value": "string", - "description": "The heading text displayed at the top of the banner.", - "isOptional": true, - "defaultValue": "''" + "name": "padding", + "value": "MaybeResponsive>", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "hidden", - "value": "boolean", - "description": "Controls whether the banner is visible or hidden.\n\nWhen using a controlled component pattern and the banner is `dismissible`, update this property to `true` when the `dismiss` event fires.\n\nYou can hide the banner programmatically by setting this to `true` even if it's not `dismissible`.", - "isOptional": true, - "defaultValue": "false" + "name": "paddingBlock", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", - "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", - "isOptional": true + "name": "paddingBlockEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onAfterHide", - "value": "(event: Event) => void", - "description": "A callback fired when the banner has fully hidden, including after any hide animations have completed.\n\nThe `hidden` property will be `true` when this event fires.", - "isOptional": true + "name": "paddingBlockStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onDismiss", - "value": "(event: Event) => void", - "description": "A callback fired when the banner is dismissed by the user clicking the close button. Does not fire when setting `hidden` manually.\n\nThe `hidden` property is `false` when this event fires.", - "isOptional": true + "name": "paddingInline", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "primaryAction", - "value": "ComponentChildren", - "description": "The primary action button or link, representing the main or most important action available in this context. Typically displayed with higher visual prominence than secondary actions to establish clear hierarchy.", - "isOptional": true + "name": "paddingInlineEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondaryActions", - "value": "ComponentChildren", - "description": "Additional action buttons or links that provide alternative or supporting actions. Visually de-emphasized compared to the primary action.", - "isOptional": true + "name": "paddingInlineStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "tone", - "value": "ToneKeyword", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.", + "name": "target", + "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", + "description": "Specifies where to display the linked URL.", "isOptional": true, "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "type", + "value": "'submit' | 'button' | 'reset'", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "isOptional": true, + "defaultValue": "'button'" } - ] - } - }, - "MakeResponsive": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "MakeResponsive", - "value": "T | `@container${string}`", - "description": "Makes a type responsive by allowing it to be either the base value or a container query string. This enables conditional styling based on container dimensions.", - "isPublicDocs": true - } - }, - "MakeResponsivePick": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "MakeResponsivePick", - "value": "{\n [P in TProperty]: MakeResponsive;\n}", - "description": "Makes a property's value potentially responsive.", - "isPublicDocs": true + ], + "value": "export interface ClickableJSXProps\n extends Partial,\n Pick {\n /**\n * The content to display inside the component. This can include text, components, or any other UI elements.\n */\n children?: ComponentChildren;\n /**\n * A callback function that's invoked when the component is clicked. It receives the click event as an argument.\n */\n onClick?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback function that's invoked when the component receives focus. It receives the focus event as an argument.\n */\n onFocus?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback function that's invoked when the component loses focus. It receives the blur event as an argument.\n */\n onBlur?: ((event: CallbackEvent) => void) | null;\n}" } }, - "RequiredBoxProps": { + "ClickableChipProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RequiredBoxProps", - "value": "Required", - "description": "Represents the box component props with all properties marked as required.", + "name": "ClickableChipProps", + "description": "The properties for the clickable chip component. These properties define an interactive chip that can be clicked or removed.", "isPublicDocs": true, "members": [ { @@ -16632,544 +17838,650 @@ "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityRole", - "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "name": "color", + "value": "ColorKeyword", + "description": "Modify the color to be more or less intense.", "isOptional": true, - "defaultValue": "'generic'" + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityVisibility", - "value": "'visible' | 'hidden' | 'exclusive'", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", "isOptional": true, - "defaultValue": "'visible'" + "defaultValue": "'--auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "background", - "value": "BackgroundColorKeyword", - "description": "The background color of the element. Use `transparent` for no background, `subdued` for a subtle background, `base` for standard background, or `strong` for a prominent background.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isOptional": true, - "defaultValue": "'transparent'" + "name": "commandFor", + "value": "string", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blockSize", - "value": "MaybeResponsive", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about the [block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", + "name": "disabled", + "value": "boolean", + "description": "Disables the chip, disallowing any interaction.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "border", - "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.\n\nAccepts a size value, optionally followed by a color, optionally followed by a style. Omitted values use defaults: color defaults to `base`, style defaults to `auto`.\n\nIndividual properties (`borderWidth`, `borderStyle`, `borderColor`) can override values set here.", + "name": "hidden", + "value": "boolean", + "description": "Determines whether the chip is hidden.\n\nIf this property is being set on each framework render (as in 'controlled' usage), and the chip is `removable`, ensure you update app state for this property when the `remove` event fires.\n\nIf the chip is not `removable`, it can still be hidden by setting this property.", "isOptional": true, - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderColor", - "value": "ColorKeyword | ''", - "description": "The color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- One value: applies to all corners\n- Two values: applies to start corners (top-left & bottom-right) and end corners (top-right & bottom-left) respectively\n- Three values: applies to start-start (top-left), end corners (top-right & bottom-left), and end-end (bottom-right) respectively\n- Four values: applies to start-start (top-left), start-end (top-right), end-end (bottom-right), and end-start (bottom-left) respectively\n\nExamples:\n- `small-100`: All corners have `small-100` radius\n- `small-100 none`: Top-left and bottom-right are `small-100`, top-right and bottom-left are `none`\n- `small-100 none large-100`: Top-left is `small-100`, top-right and bottom-left are `none`, bottom-right is `large-100`\n- `small-100 none large-100 base`: Each corner has its specified radius value", - "isOptional": true, - "defaultValue": "'none'" + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderStyle", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted.\n\nWhen set, this overrides the style value specified in the `border` property.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different styles per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", "isOptional": true, - "defaultValue": "'' - meaning no override" - }, + "defaultValue": "false" + } + ], + "value": "export interface ClickableChipProps\n extends Required<\n Pick<\n ClickableChipProps$1,\n | 'color'\n | 'accessibilityLabel'\n | 'removable'\n | 'hidden'\n | 'href'\n | 'disabled'\n | 'command'\n | 'commandFor'\n | 'interestFor'\n >\n > {}" + } + }, + "ClickableChipJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ClickableChipJSXProps", + "description": "The JSX properties for the clickable chip component. These properties define how a clickable chip is rendered in Preact or JSX.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderWidth", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "ComponentChildren", - "description": "The content displayed within the box component, which serves as a flexible container for organizing and styling other components.", + "description": "The content of the chip.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "display", - "value": "MaybeResponsive<'auto' | 'none'>", - "description": "The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n\nLearn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).", + "name": "color", + "value": "ColorKeyword", + "description": "Modify the color to be more or less intense.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "commandFor", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "inlineSize", - "value": "MaybeResponsive", - "description": "The horizontal size of the element in standard layouts (width in left-to-right or right-to-left writing modes).\n\nInline size adjusts based on the writing direction: in horizontal layouts, it controls the width; in vertical layouts, it controls the height. This ensures consistent behavior across different text directions.\n\nLearn more about the [inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", + "name": "disabled", + "value": "boolean", + "description": "Disables the chip, disallowing any interaction.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxBlockSize", - "value": "MaybeResponsive", - "description": "The maximum vertical size of the element in standard layouts (max-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the block axis.\n\nLearn more about the [max-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", - "isOptional": true, - "defaultValue": "'none'" + "name": "graphic", + "value": "ComponentChildren", + "description": "An optional icon to display at the start of the chip. Accepts only Icon components.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxInlineSize", - "value": "MaybeResponsive", - "description": "The maximum horizontal size of the element in standard layouts (max-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the inline axis.\n\nLearn more about the [max-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "name": "hidden", + "value": "boolean", + "description": "Determines whether the chip is hidden.\n\nIf this property is being set on each framework render (as in 'controlled' usage), and the chip is `removable`, ensure you update app state for this property when the `remove` event fires.\n\nIf the chip is not `removable`, it can still be hidden by setting this property.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minBlockSize", - "value": "MaybeResponsive", - "description": "The minimum vertical size of the element in standard layouts (min-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the block axis.\n\nLearn more about the [min-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", - "isOptional": true, - "defaultValue": "'0'" + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minInlineSize", - "value": "MaybeResponsive", - "description": "The minimum horizontal size of the element in standard layouts (min-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the inline axis.\n\nLearn more about the [min-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", - "isOptional": true, - "defaultValue": "'0'" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "overflow", - "value": "'hidden' | 'visible'", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", - "isOptional": true, - "defaultValue": "'visible'" + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "padding", - "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding.", - "isOptional": true, - "defaultValue": "'none'" + "name": "onAfterHide", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired after the chip finishes hiding.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlock", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "onClick", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired when the chip is clicked.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockEnd", - "value": "MaybeResponsive", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "onRemove", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired when the chip is removed.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockStart", - "value": "MaybeResponsive", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`.", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", "isOptional": true, - "defaultValue": "'' - meaning no override" - }, + "defaultValue": "false" + } + ], + "value": "export interface ClickableChipJSXProps\n extends Partial,\n Pick {\n /**\n * The content of the chip.\n */\n children?: ComponentChildren;\n /**\n * An optional icon to display at the start of the chip. Accepts only Icon components.\n */\n graphic?: ComponentChildren;\n /**\n * A callback that's fired when the chip is clicked.\n */\n onClick?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's fired when the chip is removed.\n */\n onRemove?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's fired after the chip finishes hiding.\n */\n onAfterHide?: ((event: CallbackEvent) => void) | null;\n}" + } + }, + "ColorFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "ColorFieldProps", + "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required>", + "description": "The properties for the color field component. These properties configure an input field that allows merchants to select colors using an integrated visual color picker with text input, hex color format, and optional alpha (transparency) channel support.", + "isPublicDocs": true + } + }, + "PreactFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "PreactFieldProps", + "value": "PreactInputProps & Required<\n Pick<\n TextFieldProps$1,\n | 'defaultValue'\n | 'details'\n | 'error'\n | 'label'\n | 'labelAccessibilityVisibility'\n | 'placeholder'\n | 'readOnly'\n | 'required'\n >\n > & {\n /**\n * A hint as to the intended content of the field.\n *\n * When set to `on` (the default), this property indicates that the field should support\n * autofill, but you do not have any more semantic information on the intended\n * contents.\n *\n * When set to `off`, you are indicating that this field contains sensitive\n * information, or contents that are never saved, like one-time codes.\n *\n * Alternatively, you can provide value which describes the\n * specific data you would like to be entered into this field during autofill.\n *\n * @see Learn more about the set of {@link https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens|autocomplete values} supported in browsers.\n *\n * @default 'tel' for PhoneField\n * @default 'email' for EmailField\n * @default 'url' for URLField\n * @default 'on' for everything else\n */\n autocomplete: Autocomplete;\n }", + "description": "" + } + }, + "PreactInputProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "PreactInputProps", + "value": "Required<\n Pick\n>", + "description": "", + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInline", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`.", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineEnd", - "value": "MaybeResponsive", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineStart", - "value": "MaybeResponsive", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", + "isOptional": true } ] } }, - "ResponsiveBoxProps": { + "TextFieldProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", - "name": "ResponsiveBoxProps", - "value": "MakeResponsivePick<\n RequiredBoxProps,\n | 'padding'\n | 'paddingBlock'\n | 'paddingBlockStart'\n | 'paddingBlockEnd'\n | 'paddingInline'\n | 'paddingInlineStart'\n | 'paddingInlineEnd'\n | 'display'\n>", - "description": "Represents box props with responsive capabilities for layout properties.\n\nThis enables conditional styling based on container queries.", + "name": "TextFieldProps", + "value": "PreactFieldProps<\n /** @default 'on' */\n Required['autocomplete']\n> & Required<\n Pick<\n TextFieldProps$1,\n 'icon' | 'maxLength' | 'minLength' | 'prefix' | 'suffix'\n >\n >", + "description": "The properties for the text field component. Extends `PreactFieldProps` with text-specific features like icons, length constraints, and prefix/suffix content.", + "isPublicDocs": true + } + }, + "ColorFieldJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ColorFieldJSXProps", + "description": "The JSX props for the color field component. These properties extend `ColorFieldProps` with JSX-specific event callbacks for React-style event handling when used in Preact, including callbacks for color changes as the merchant interacts with the picker.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "display", - "value": "MaybeResponsive<'auto' | 'none'>", - "description": "The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n\nLearn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).", + "name": "alpha", + "value": "boolean", + "description": "Allow user to select an alpha value.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "padding", - "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding.", - "isOptional": true, - "defaultValue": "'none'" + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlock", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockEnd", - "value": "MaybeResponsive", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockStart", - "value": "MaybeResponsive", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`.", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInline", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineEnd", - "value": "MaybeResponsive", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineStart", - "value": "MaybeResponsive", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`.", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "'' - meaning no override" - } - ] - } - }, - "ButtonOnlyProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ButtonOnlyProps", - "value": "", - "description": "Represents button props that are specific to button-type elements only. Extracts the subset of `ButtonProps` that includes the `type` property.", - "isPublicDocs": true, - "members": [ + "defaultValue": "'visible'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityLabel", + "name": "name", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The label text or elements displayed inside the button component, describing the action that will be performed when clicked.", + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", - "isOptional": true, - "defaultValue": "'--auto'" + "name": "onChange", + "value": "(event: CallbackEvent<\"s-color-field\">) => void", + "description": "A callback that's triggered when the color value changes and the field loses focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onInput", + "value": "(event: CallbackEvent<\"s-color-field\">) => void", + "description": "A callback that's triggered when the color value changes as the user interacts with the picker.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", + "name": "readOnly", "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "download", - "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", - "isOptional": true + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "href", + "name": "value", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true - }, + } + ], + "value": "export interface ColorFieldJSXProps\n extends Partial>,\n Pick,\n FieldReactProps,\n FieldSlotInternalReactProps {\n /**\n * A callback that's triggered when the color value changes as the user interacts with the picker.\n */\n onInput?: (event: CallbackEvent) => void;\n /**\n * A callback that's triggered when the color value changes and the field loses focus.\n */\n onChange?: (event: CallbackEvent) => void;\n}" + } + }, + "ColorPickerProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ColorPickerProps", + "description": "Properties for rendering a color picker that provides a visual interface for selecting colors with optional transparency control.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "icon", - "value": "IconType | AnyString", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier.", + "name": "alpha", + "value": "boolean", + "description": "Allow user to select an alpha value.", "isOptional": true, - "defaultValue": "''" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", + "name": "defaultValue", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "inlineSize", - "value": "'auto' | 'fill' | 'fit-content'", - "description": "The displayed inline width of the button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", + "name": "name", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "lang", + "name": "value", "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry).", + "description": "The currently selected color.\n\nSupported formats include:\n- HSL", "isOptional": true - }, + } + ], + "value": "export interface ColorPickerProps\n extends Required<\n Pick\n > {}" + } + }, + "ColorPickerJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ColorPickerJSXProps", + "description": "The JSX props interface for the color picker component when used in React/Preact.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "loading", + "name": "alpha", "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", + "description": "Allow user to select an alpha value.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onBlur", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onClick", - "value": "(event: Event) => void", - "description": "A callback fired when the button is activated, before performing the action indicated by `type`. Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onFocus", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "target", - "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", - "isOptional": true, - "defaultValue": "'auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "tone", - "value": "ToneKeyword", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "onChange", + "value": "(event: CallbackEvent<\"s-color-picker\">) => void", + "description": "A callback that's triggered when the selected color changes and the picker loses focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "type", - "value": "'submit' | 'button' | 'reset'", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", - "isOptional": true, - "defaultValue": "'button'" + "name": "onInput", + "value": "(event: CallbackEvent<\"s-color-picker\">) => void", + "description": "A callback that's triggered when the selected color changes as the user interacts with the picker.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "variant", - "value": "'auto' | 'primary' | 'secondary' | 'tertiary'", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "value", + "value": "string", + "description": "The currently selected color.\n\nSupported formats include:\n- HSL", + "isOptional": true } - ] + ], + "value": "export interface ColorPickerJSXProps\n extends Partial,\n Pick<\n ColorPickerProps$1,\n 'id' | 'alpha' | 'value' | 'defaultValue' | 'name'\n > {\n /**\n * A callback that's triggered when the selected color changes as the user interacts with the picker.\n */\n onInput?: (event: CallbackEvent) => void | null;\n /**\n * A callback that's triggered when the selected color changes and the picker loses focus.\n */\n onChange?: (event: CallbackEvent) => void | null;\n}" } }, - "ButtonBaseProps": { + "DateFieldProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ButtonBaseProps", - "value": "Required<\n Pick<\n ButtonOnlyProps,\n | 'accessibilityLabel'\n | 'disabled'\n | 'command'\n | 'commandFor'\n | 'icon'\n | 'interestFor'\n | 'lang'\n | 'loading'\n | 'type'\n | 'tone'\n | 'variant'\n | 'target'\n | 'href'\n | 'download'\n >\n>", - "description": "Represents the base button props with all properties marked as required.", + "name": "DateFieldProps", + "description": "The properties for the date field component. These properties configure an input field that allows merchants to select dates using an integrated calendar picker with optional text input, date constraints, and day-of-week restrictions.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityLabel", + "name": "allow", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", - "isOptional": true + "description": "Dates that can be selected.\n\nA comma-separated list of dates, date ranges. Whitespace is allowed after commas.\n\nThe default `''` allows all dates.\n\n- Dates in `YYYY-MM-DD` format allow a single date.\n- Dates in `YYYY-MM` format allow a whole month.\n- Dates in `YYYY` format allow a whole year.\n- Ranges are expressed as `start--end`. - Ranges are inclusive.\n - If either `start` or `end` is omitted, the range is unbounded in that direction.\n - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.\n So `2024--` is equivalent to `2024-01-01--`.\n - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.\n So `--2024` is equivalent to `--2024-12-31`.\n - Whitespace is allowed either side of `--`.", + "isOptional": true, + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", + "name": "allowDays", + "value": "string", + "description": "Days of the week that can be selected. These intersect with the result of `allow` and `disallow`.\n\nA comma-separated list of days. Whitespace is allowed after commas.\n\nThe default `''` has no effect on the result of `allow` and `disallow`.\n\nDays are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.", "isOptional": true, - "defaultValue": "'--auto'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultView", "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", + "description": "Default month to display in `YYYY-MM` format.\n\nThis value is used until `view` is set, either directly or as a result of user interaction.\n\nDefaults to the current month in the user's locale.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -17177,992 +18489,1098 @@ "syntaxKind": "PropertySignature", "name": "disabled", "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", + "description": "Disables the field, disallowing any interaction.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "download", + "name": "disallow", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", - "isOptional": true + "description": "Dates that cannot be selected. These subtract from `allow`.\n\nA comma-separated list of dates, date ranges. Whitespace is allowed after commas.\n\nThe default `''` has no effect on `allow`.\n\n- Dates in `YYYY-MM-DD` format disallow a single date.\n- Dates in `YYYY-MM` format disallow a whole month.\n- Dates in `YYYY` format disallow a whole year.\n- Ranges are expressed as `start--end`. - Ranges are inclusive.\n - If either `start` or `end` is omitted, the range is unbounded in that direction.\n - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.\n So `2024--` is equivalent to `2024-01-01--`.\n - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.\n So `--2024` is equivalent to `--2024-12-31`.\n - Whitespace is allowed either side of `--`.", + "isOptional": true, + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "href", + "name": "disallowDays", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", - "isOptional": true + "description": "Days of the week that cannot be selected. This subtracts from `allowDays`, and intersects with the result of `allow` and `disallow`.\n\nA comma-separated list of days. Whitespace is allowed after commas.\n\nThe default `''` has no effect on `allowDays`.\n\nDays are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.", + "isOptional": true, + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "icon", - "value": "IconType | AnyString", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier.", - "isOptional": true, - "defaultValue": "''" + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", + "name": "id", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "lang", - "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry).", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "loading", - "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "target", - "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "tone", - "value": "ToneKeyword", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "type", - "value": "'submit' | 'button' | 'reset'", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "isOptional": true, - "defaultValue": "'button'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "variant", - "value": "'auto' | 'primary' | 'secondary' | 'tertiary'", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "isOptional": true, - "defaultValue": "'auto'" - } - ] - } - }, - "PreactInputProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "PreactInputProps", - "value": "Required<\n Pick\n>", - "description": "Represents the essential input props required for Preact-based input elements. Includes properties like `disabled`, `id`, `name`, and `value`.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "disabled", + "name": "required", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", - "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "name", + "name": "value", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "value", + "name": "view", "value": "string", - "description": "", + "description": "Displayed month in `YYYY-MM` format.\n\n`onViewChange` is called when this value changes.\n\nDefaults to `defaultView`.", "isOptional": true } - ] + ], + "value": "export interface DateFieldProps\n extends PreactFieldProps,\n Required<\n Pick<\n DateFieldProps$1,\n | 'allow'\n | 'allowDays'\n | 'disallow'\n | 'disallowDays'\n | 'value'\n | 'defaultValue'\n | 'view'\n | 'defaultView'\n >\n > {}" } }, - "ClickableBaseProps": { + "DateFieldJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ClickableBaseProps", - "value": "Required<\n Pick<\n ClickableProps$1,\n | 'command'\n | 'commandFor'\n | 'interestFor'\n | 'disabled'\n | 'download'\n | 'href'\n | 'lang'\n | 'loading'\n | 'overflow'\n | 'target'\n | 'type'\n >\n>", - "description": "Represents the base clickable props with all properties marked as required.", + "name": "DateFieldJSXProps", + "description": "The JSX props for the date field component. These properties extend `DateFieldProps` with JSX-specific event callbacks for React-style event handling when used in Preact, including specialized callbacks for view changes and invalid date attempts.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", + "name": "allow", + "value": "string", + "description": "Dates that can be selected.\n\nA comma-separated list of dates, date ranges. Whitespace is allowed after commas.\n\nThe default `''` allows all dates.\n\n- Dates in `YYYY-MM-DD` format allow a single date.\n- Dates in `YYYY-MM` format allow a whole month.\n- Dates in `YYYY` format allow a whole year.\n- Ranges are expressed as `start--end`. - Ranges are inclusive.\n - If either `start` or `end` is omitted, the range is unbounded in that direction.\n - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.\n So `2024--` is equivalent to `2024-01-01--`.\n - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.\n So `--2024` is equivalent to `--2024-12-31`.\n - Whitespace is allowed either side of `--`.", "isOptional": true, - "defaultValue": "'--auto'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", + "name": "allowDays", "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "disabled", - "value": "boolean", - "description": "Whether the component is disabled, preventing clicks and focus. When disabled, the `click` event won't fire and click events from child elements stop propagating immediately. Interactive child elements can still receive focus and be interacted with. This doesn't apply visual styling by default. You shouldapply disabled styling as needed.", + "description": "Days of the week that can be selected. These intersect with the result of `allow` and `disallow`.\n\nA comma-separated list of days. Whitespace is allowed after commas.\n\nThe default `''` has no effect on the result of `allow` and `disallow`.\n\nDays are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "download", - "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", - "isOptional": true + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "href", + "name": "defaultValue", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", + "name": "defaultView", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "Default month to display in `YYYY-MM` format.\n\nThis value is used until `view` is set, either directly or as a result of user interaction.\n\nDefaults to the current month in the user's locale.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "lang", - "value": "string", - "description": "The language of the text content.\n\nUse this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation.\n\nThe value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry).", - "isOptional": true, - "defaultValue": "''" + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "loading", + "name": "disabled", "value": "boolean", - "description": "Whether the component is in a loading state, which indicates to assistive technology that an action is in progress and prevents interaction.", + "description": "Disables the field, disallowing any interaction.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "overflow", - "value": "'hidden' | 'visible'", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "name": "disallow", + "value": "string", + "description": "Dates that cannot be selected. These subtract from `allow`.\n\nA comma-separated list of dates, date ranges. Whitespace is allowed after commas.\n\nThe default `''` has no effect on `allow`.\n\n- Dates in `YYYY-MM-DD` format disallow a single date.\n- Dates in `YYYY-MM` format disallow a whole month.\n- Dates in `YYYY` format disallow a whole year.\n- Ranges are expressed as `start--end`. - Ranges are inclusive.\n - If either `start` or `end` is omitted, the range is unbounded in that direction.\n - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.\n So `2024--` is equivalent to `2024-01-01--`.\n - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.\n So `--2024` is equivalent to `--2024-12-31`.\n - Whitespace is allowed either side of `--`.", "isOptional": true, - "defaultValue": "'visible'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "target", - "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "name": "disallowDays", + "value": "string", + "description": "Days of the week that cannot be selected. This subtracts from `allowDays`, and intersects with the result of `allow` and `disallow`.\n\nA comma-separated list of days. Whitespace is allowed after commas.\n\nThe default `''` has no effect on `allowDays`.\n\nDays are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "type", - "value": "'submit' | 'button' | 'reset'", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", - "isOptional": true, - "defaultValue": "'button'" - } - ] - } - }, - "PreactFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "PreactFieldProps", - "value": "PreactInputProps & Required<\n Pick<\n TextFieldProps$1,\n | 'defaultValue'\n | 'details'\n | 'error'\n | 'label'\n | 'labelAccessibilityVisibility'\n | 'placeholder'\n | 'readOnly'\n | 'required'\n >\n > & {\n /**\n * Controls browser autofill behavior for the field.\n *\n * Basic values:\n * - `on` - Enables autofill without specifying content type (default)\n * - `off` - Disables autofill for sensitive data or one-time codes\n *\n * Specific field values describe the expected data type. You can optionally prefix these with:\n * - `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n * - `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n * - Both section and group (for example, `section-primary shipping email`)\n *\n * Providing a specific autofill token helps browsers suggest more relevant saved data.\n *\n * Learn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.\n *\n * @default 'tel' for PhoneField\n * @default 'email' for EmailField\n * @default 'url' for URLField\n * @default 'on' for everything else\n */\n autocomplete: Autocomplete;\n }", - "description": "Represents the props for Preact-based form field components with autocomplete support. The generic type parameter allows specifying the valid autocomplete values for the field.", - "isPublicDocs": true - } - }, - "TextFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "TextFieldProps", - "value": "PreactFieldProps<\n /** @default 'on' */\n Required['autocomplete']\n> & Required<\n Pick<\n TextFieldProps$1,\n 'icon' | 'maxLength' | 'minLength' | 'prefix' | 'suffix'\n >\n >", - "description": "Represents the props for text input field components. Extends `PreactFieldProps` with autocomplete support for text-related fields.", - "isPublicDocs": true - } - }, - "ColorFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ColorFieldProps", - "value": "Omit<\n PreactFieldProps['autocomplete']>,\n 'value' | 'defaultValue'\n> & Required>", - "description": "Represents the props for color input field components. Extends `PreactFieldProps` with autocomplete support for color-related fields.", - "isPublicDocs": true - } - }, - "ReplaceType": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ReplaceType", - "value": "Exclude | TTo", - "description": "A utility type that replaces occurrences of one type with another within a union type. Useful for type transformations where you need to swap out specific types.", - "isPublicDocs": true - } - }, - "EmailFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "EmailFieldProps", - "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required>", - "description": "Represents the props for email input field components. Extends `PreactFieldProps` with autocomplete support for email-related fields.", - "isPublicDocs": true - } - }, - "RequiredAlignedProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RequiredAlignedProps", - "value": "Required", - "description": "Represents the grid component props with all properties marked as required.", - "isPublicDocs": true, - "members": [ + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityLabel", + "name": "id", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityRole", - "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", - "isOptional": true, - "defaultValue": "'generic'" + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityVisibility", - "value": "'visible' | 'hidden' | 'exclusive'", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "alignContent", - "value": "MaybeResponsive", - "description": "The vertical alignment of the entire grid within its container (in horizontal layouts).\n\nUse this to distribute grid rows along the block axis (vertical in left-to-right/right-to-left layouts, horizontal in vertical writing modes). This property overrides the block value set by `placeContent`.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "alignItems", - "value": "MaybeResponsive", - "description": "The vertical alignment of grid items within their grid areas (in horizontal layouts).\n\nUse this to position items along the block axis (vertical in left-to-right/right-to-left layouts, horizontal in vertical writing modes). This property overrides the block value set by `placeItems`.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the field loses focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "background", - "value": "BackgroundColorKeyword", - "description": "The background color of the element. Use `transparent` for no background, `subdued` for a subtle background, `base` for standard background, or `strong` for a prominent background.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isOptional": true, - "defaultValue": "'transparent'" + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the field's value changes and the field loses focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blockSize", - "value": "MaybeResponsive", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about the [block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the field receives focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "border", - "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.\n\nAccepts a size value, optionally followed by a color, optionally followed by a style. Omitted values use defaults: color defaults to `base`, style defaults to `auto`.\n\nIndividual properties (`borderWidth`, `borderStyle`, `borderColor`) can override values set here.", - "isOptional": true, - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the field's value changes as the user types or selects.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderColor", - "value": "ColorKeyword | ''", - "description": "The color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "onInvalid", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the user attempts to enter an invalid date.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- One value: applies to all corners\n- Two values: applies to start corners (top-left & bottom-right) and end corners (top-right & bottom-left) respectively\n- Three values: applies to start-start (top-left), end corners (top-right & bottom-left), and end-end (bottom-right) respectively\n- Four values: applies to start-start (top-left), start-end (top-right), end-end (bottom-right), and end-start (bottom-left) respectively\n\nExamples:\n- `small-100`: All corners have `small-100` radius\n- `small-100 none`: Top-left and bottom-right are `small-100`, top-right and bottom-left are `none`\n- `small-100 none large-100`: Top-left is `small-100`, top-right and bottom-left are `none`, bottom-right is `large-100`\n- `small-100 none large-100 base`: Each corner has its specified radius value", - "isOptional": true, - "defaultValue": "'none'" + "name": "onViewChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the visible month or year in the calendar changes.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderStyle", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted.\n\nWhen set, this overrides the style value specified in the `border` property.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different styles per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", - "isOptional": true, - "defaultValue": "'' - meaning no override" - }, + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderWidth", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The content displayed within the box component, which serves as a flexible container for organizing and styling other components.", - "isOptional": true + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "columnGap", - "value": "MaybeResponsive", - "description": "The horizontal spacing between elements (in horizontal writing modes).\n\nSets the gap along the inline axis. This overrides the column value specified in `gap`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "display", - "value": "MaybeResponsive<'auto' | 'none'>", - "description": "The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n\nLearn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).", - "isOptional": true, - "defaultValue": "'auto'" - }, + "name": "view", + "value": "string", + "description": "Displayed month in `YYYY-MM` format.\n\n`onViewChange` is called when this value changes.\n\nDefaults to `defaultView`.", + "isOptional": true + } + ], + "value": "export interface DateFieldJSXProps\n extends Partial>,\n Pick,\n FieldSlotInternalReactProps {\n /**\n * A callback that's triggered when the field loses focus.\n */\n onBlur?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the field's value changes and the field loses focus.\n */\n onChange?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the field receives focus.\n */\n onFocus?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the field's value changes as the user types or selects.\n */\n onInput?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the user attempts to enter an invalid date.\n */\n onInvalid?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the visible month or year in the calendar changes.\n */\n onViewChange?: ((event: CallbackEvent) => void) | null;\n}" + } + }, + "DatePickerProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "DatePickerProps", + "description": "The properties for the date picker component. These properties configure a standalone calendar interface for selecting single dates or date ranges, with support for date constraints, day-of-week restrictions, and month/year navigation.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gap", - "value": "MaybeResponsive>", - "description": "The spacing between child elements.\n\nAccepts a single value to apply to both axes, or two space-separated values to set the row and column gaps independently. For example: `large-100 large-500` sets the row gap to `large-100` and column gap to `large-500`.", + "name": "allow", + "value": "string", + "description": "Dates that can be selected.\n\nA comma-separated list of dates, date ranges. Whitespace is allowed after commas.\n\nThe default `''` allows all dates.\n\n- Dates in `YYYY-MM-DD` format allow a single date.\n- Dates in `YYYY-MM` format allow a whole month.\n- Dates in `YYYY` format allow a whole year.\n- Ranges are expressed as `start--end`. - Ranges are inclusive.\n - If either `start` or `end` is omitted, the range is unbounded in that direction.\n - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.\n So `2024--` is equivalent to `2024-01-01--`.\n - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.\n So `--2024` is equivalent to `--2024-12-31`.\n - Whitespace is allowed either side of `--`.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gridTemplateColumns", - "value": "MaybeResponsive", - "description": "The columns in the grid and their sizes.\n\nUse values like `1fr 2fr` to create fluid columns, `200px 1fr` to mix fixed and flexible columns, or `repeat(3, 1fr)` to create equal-width columns.\n\nLearn more about the [grid-template-columns property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-columns).", + "name": "allowDays", + "value": "string", + "description": "Days of the week that can be selected. These intersect with the result of `allow` and `disallow`.\n\nA comma-separated list of days. Whitespace is allowed after commas.\n\nThe default `''` has no effect on the result of `allow` and `disallow`.\n\nDays are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gridTemplateRows", - "value": "MaybeResponsive", - "description": "The rows in the grid and their sizes.\n\nUse values like `100px auto` to create rows with fixed and automatic heights, or `repeat(3, 100px)` to create equal-height rows.\n\nLearn more about the [grid-template-rows property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-rows).", + "name": "defaultValue", + "value": "string", + "description": "Default selected value.\n\nThe default means no date is selected.\n\nIf the provided value is invalid, no date is selected.\n\n- If `type=\"single\"`, this is a date in `YYYY-MM-DD` format.\n- If `type=\"multiple\"`, this is a comma-separated list of dates in `YYYY-MM-DD` format.\n- If `type=\"range\"`, this is a range in `YYYY-MM-DD--YYYY-MM-DD` format. The range is inclusive.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "\"\"" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", + "name": "defaultView", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "Default month to display in `YYYY-MM` format.\n\nThis value is used until `view` is set, either directly or as a result of user interaction.\n\nDefaults to the current month in the user's locale.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "inlineSize", - "value": "MaybeResponsive", - "description": "The horizontal size of the element in standard layouts (width in left-to-right or right-to-left writing modes).\n\nInline size adjusts based on the writing direction: in horizontal layouts, it controls the width; in vertical layouts, it controls the height. This ensures consistent behavior across different text directions.\n\nLearn more about the [inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", + "name": "disallow", + "value": "string", + "description": "Dates that cannot be selected. These subtract from `allow`.\n\nA comma-separated list of dates, date ranges. Whitespace is allowed after commas.\n\nThe default `''` has no effect on `allow`.\n\n- Dates in `YYYY-MM-DD` format disallow a single date.\n- Dates in `YYYY-MM` format disallow a whole month.\n- Dates in `YYYY` format disallow a whole year.\n- Ranges are expressed as `start--end`. - Ranges are inclusive.\n - If either `start` or `end` is omitted, the range is unbounded in that direction.\n - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.\n So `2024--` is equivalent to `2024-01-01--`.\n - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.\n So `--2024` is equivalent to `--2024-12-31`.\n - Whitespace is allowed either side of `--`.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "justifyContent", - "value": "MaybeResponsive", - "description": "The horizontal alignment of the entire grid within its container (in horizontal layouts).\n\nUse this to distribute grid columns along the inline axis (horizontal in left-to-right/right-to-left layouts, vertical in vertical writing modes). This property overrides the inline value set by `placeContent`.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", + "name": "disallowDays", + "value": "string", + "description": "Days of the week that cannot be selected. This subtracts from `allowDays`, and intersects with the result of `allow` and `disallow`.\n\nA comma-separated list of days. Whitespace is allowed after commas.\n\nThe default `''` has no effect on `allowDays`.\n\nDays are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "justifyItems", - "value": "MaybeResponsive", - "description": "The horizontal alignment of grid items within their grid areas (in horizontal layouts).\n\nUse this to position items along the inline axis (horizontal in left-to-right/right-to-left layouts, vertical in vertical writing modes). This property overrides the inline value set by `placeItems`.\n\nLearn more about the [justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxBlockSize", - "value": "MaybeResponsive", - "description": "The maximum vertical size of the element in standard layouts (max-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the block axis.\n\nLearn more about the [max-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", - "isOptional": true, - "defaultValue": "'none'" + "name": "type", + "value": "'single' | 'range'", + "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "defaultValue": "\"single\"" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxInlineSize", - "value": "MaybeResponsive", - "description": "The maximum horizontal size of the element in standard layouts (max-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the inline axis.\n\nLearn more about the [max-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "name": "value", + "value": "string", + "description": "Current selected value.\n\nThe default means no date is selected.\n\nIf the provided value is invalid, no date is selected.\n\nOtherwise:\n\n- If `type=\"single\"`, this is a date in `YYYY-MM-DD` format.\n- If `type=\"multiple\"`, this is a comma-separated list of dates in `YYYY-MM-DD` format.\n- If `type=\"range\"`, this is a range in `YYYY-MM-DD--YYYY-MM-DD` format. The range is inclusive.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "\"\"" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minBlockSize", - "value": "MaybeResponsive", - "description": "The minimum vertical size of the element in standard layouts (min-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the block axis.\n\nLearn more about the [min-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "name": "view", + "value": "string", + "description": "Displayed month in `YYYY-MM` format.\n\n`onViewChange` is called when this value changes.\n\nDefaults to `defaultView`.", + "isOptional": true + } + ], + "value": "export interface DatePickerProps\n extends Required<\n Pick<\n DatePickerProps$1,\n | 'defaultView'\n | 'view'\n | 'allow'\n | 'disallow'\n | 'allowDays'\n | 'disallowDays'\n | 'value'\n | 'defaultValue'\n | 'name'\n >\n > {\n /**\n * The type of date selection allowed.\n *\n * - `single`: Select a single date\n * - `range`: Select a date range\n *\n * @default \"single\"\n */\n type: Extract;\n}" + } + }, + "DatePickerJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "DatePickerJSXProps", + "description": "The JSX props for the date picker component. These properties extend `DatePickerProps` with JSX-specific event callbacks for React-style event handling when used in Preact, including callbacks for date selection, focus events, and view changes.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "allow", + "value": "string", + "description": "Dates that can be selected.\n\nA comma-separated list of dates, date ranges. Whitespace is allowed after commas.\n\nThe default `''` allows all dates.\n\n- Dates in `YYYY-MM-DD` format allow a single date.\n- Dates in `YYYY-MM` format allow a whole month.\n- Dates in `YYYY` format allow a whole year.\n- Ranges are expressed as `start--end`. - Ranges are inclusive.\n - If either `start` or `end` is omitted, the range is unbounded in that direction.\n - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.\n So `2024--` is equivalent to `2024-01-01--`.\n - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.\n So `--2024` is equivalent to `--2024-12-31`.\n - Whitespace is allowed either side of `--`.", "isOptional": true, - "defaultValue": "'0'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minInlineSize", - "value": "MaybeResponsive", - "description": "The minimum horizontal size of the element in standard layouts (min-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the inline axis.\n\nLearn more about the [min-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "name": "allowDays", + "value": "string", + "description": "Days of the week that can be selected. These intersect with the result of `allow` and `disallow`.\n\nA comma-separated list of days. Whitespace is allowed after commas.\n\nThe default `''` has no effect on the result of `allow` and `disallow`.\n\nDays are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.", "isOptional": true, - "defaultValue": "'0'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "overflow", - "value": "'hidden' | 'visible'", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "name": "defaultValue", + "value": "string", + "description": "Default selected value.\n\nThe default means no date is selected.\n\nIf the provided value is invalid, no date is selected.\n\n- If `type=\"single\"`, this is a date in `YYYY-MM-DD` format.\n- If `type=\"multiple\"`, this is a comma-separated list of dates in `YYYY-MM-DD` format.\n- If `type=\"range\"`, this is a range in `YYYY-MM-DD--YYYY-MM-DD` format. The range is inclusive.", "isOptional": true, - "defaultValue": "'visible'" + "defaultValue": "\"\"" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "padding", - "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding.", - "isOptional": true, - "defaultValue": "'none'" + "name": "defaultView", + "value": "string", + "description": "Default month to display in `YYYY-MM` format.\n\nThis value is used until `view` is set, either directly or as a result of user interaction.\n\nDefaults to the current month in the user's locale.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlock", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`.", + "name": "disallow", + "value": "string", + "description": "Dates that cannot be selected. These subtract from `allow`.\n\nA comma-separated list of dates, date ranges. Whitespace is allowed after commas.\n\nThe default `''` has no effect on `allow`.\n\n- Dates in `YYYY-MM-DD` format disallow a single date.\n- Dates in `YYYY-MM` format disallow a whole month.\n- Dates in `YYYY` format disallow a whole year.\n- Ranges are expressed as `start--end`. - Ranges are inclusive.\n - If either `start` or `end` is omitted, the range is unbounded in that direction.\n - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.\n So `2024--` is equivalent to `2024-01-01--`.\n - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.\n So `--2024` is equivalent to `--2024-12-31`.\n - Whitespace is allowed either side of `--`.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockEnd", - "value": "MaybeResponsive", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`.", + "name": "disallowDays", + "value": "string", + "description": "Days of the week that cannot be selected. This subtracts from `allowDays`, and intersects with the result of `allow` and `disallow`.\n\nA comma-separated list of days. Whitespace is allowed after commas.\n\nThe default `''` has no effect on `allowDays`.\n\nDays are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockStart", - "value": "MaybeResponsive", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInline", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineEnd", - "value": "MaybeResponsive", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the picker loses focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineStart", - "value": "MaybeResponsive", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the selected date changes and the picker loses focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "placeContent", - "value": "MaybeResponsive<\n `${AlignContentKeyword} ${JustifyContentKeyword}` | AlignContentKeyword\n >", - "description": "A shorthand property for `justify-content` and `align-content`.\n\nLearn more about the [place-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/place-content).", - "isOptional": true, - "defaultValue": "'normal normal'" + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the picker receives focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "placeItems", - "value": "MaybeResponsive<\n `${AlignItemsKeyword} ${JustifyItemsKeyword}` | AlignItemsKeyword\n >", - "description": "A shorthand for setting both `justify-items` and `align-items` in a single declaration.\n\nAccepts either a single value (applied to both axes) or two space-separated values (align-items justify-items).\n\nLearn more about the [place-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/place-items).", - "isOptional": true, - "defaultValue": "'normal normal'" + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the selected date changes as the user interacts with the picker.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "rowGap", - "value": "MaybeResponsive", - "description": "The vertical spacing between elements (in horizontal writing modes).\n\nSets the gap along the block axis. This overrides the row value specified in `gap`.", + "name": "onViewChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the visible month or year in the calendar changes.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "type", + "value": "'single' | 'range'", + "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "defaultValue": "\"single\"" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "Current selected value.\n\nThe default means no date is selected.\n\nIf the provided value is invalid, no date is selected.\n\nOtherwise:\n\n- If `type=\"single\"`, this is a date in `YYYY-MM-DD` format.\n- If `type=\"multiple\"`, this is a comma-separated list of dates in `YYYY-MM-DD` format.\n- If `type=\"range\"`, this is a range in `YYYY-MM-DD--YYYY-MM-DD` format. The range is inclusive.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "\"\"" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "view", + "value": "string", + "description": "Displayed month in `YYYY-MM` format.\n\n`onViewChange` is called when this value changes.\n\nDefaults to `defaultView`.", + "isOptional": true } - ] + ], + "value": "export interface DatePickerJSXProps\n extends Partial,\n Pick {\n /**\n * A callback that's triggered when the visible month or year in the calendar changes.\n */\n onViewChange?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the picker receives focus.\n */\n onFocus?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the picker loses focus.\n */\n onBlur?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the selected date changes as the user interacts with the picker.\n */\n onInput?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the selected date changes and the picker loses focus.\n */\n onChange?: ((event: CallbackEvent) => void) | null;\n}" } }, - "ResponsiveGridProps": { + "DividerProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ResponsiveGridProps", - "value": "MakeResponsivePick<\n RequiredAlignedProps,\n 'rowGap' | 'columnGap' | 'gap' | 'gridTemplateColumns' | 'gridTemplateRows'\n>", - "description": "Represents grid props with responsive capabilities for layout properties.\n\nThis enables conditional styling based on container queries.", + "name": "DividerProps", + "description": "The properties for the divider component. A divider creates a visual separator to distinguish different sections of content.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "columnGap", - "value": "MaybeResponsive", - "description": "The horizontal spacing between elements (in horizontal writing modes).\n\nSets the gap along the inline axis. This overrides the column value specified in `gap`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "color", + "value": "'base' | 'strong'", + "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gap", - "value": "MaybeResponsive>", - "description": "The spacing between child elements.\n\nAccepts a single value to apply to both axes, or two space-separated values to set the row and column gaps independently. For example: `large-100 large-500` sets the row gap to `large-100` and column gap to `large-500`.", - "isOptional": true, - "defaultValue": "'none'" - }, + "name": "direction", + "value": "'inline' | 'block'", + "description": "The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n\n- `inline`: Horizontal divider for separating vertically stacked content\n- `block`: Vertical divider for separating horizontally arranged content", + "defaultValue": "'inline'" + } + ], + "value": "export interface DividerProps\n extends Pick {\n /**\n * The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n *\n * - `inline`: Horizontal divider for separating vertically stacked content\n * - `block`: Vertical divider for separating horizontally arranged content\n *\n * @default 'inline'\n */\n direction: Extract;\n /**\n * The visual prominence of the divider line.\n *\n * - `base`: Standard divider for most separations (default)\n * - `strong`: More prominent divider for major section breaks\n *\n * @default 'base'\n */\n color: Extract;\n}" + } + }, + "DividerJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "DividerJSXProps", + "description": "The properties for the divider component when it's used in JSX.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gridTemplateColumns", - "value": "MaybeResponsive", - "description": "The columns in the grid and their sizes.\n\nUse values like `1fr 2fr` to create fluid columns, `200px 1fr` to mix fixed and flexible columns, or `repeat(3, 1fr)` to create equal-width columns.\n\nLearn more about the [grid-template-columns property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-columns).", - "isOptional": true, - "defaultValue": "'none'" + "name": "color", + "value": "'base' | 'strong'", + "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gridTemplateRows", - "value": "MaybeResponsive", - "description": "The rows in the grid and their sizes.\n\nUse values like `100px auto` to create rows with fixed and automatic heights, or `repeat(3, 100px)` to create equal-height rows.\n\nLearn more about the [grid-template-rows property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-rows).", - "isOptional": true, - "defaultValue": "'none'" + "name": "direction", + "value": "'inline' | 'block'", + "description": "The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n\n- `inline`: Horizontal divider for separating vertically stacked content\n- `block`: Vertical divider for separating horizontally arranged content", + "defaultValue": "'inline'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "rowGap", - "value": "MaybeResponsive", - "description": "The vertical spacing between elements (in horizontal writing modes).\n\nSets the gap along the block axis. This overrides the row value specified in `gap`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true } - ] + ], + "value": "export interface DividerJSXProps\n extends Partial,\n Pick {}" } }, - "RequiredGridItemProps": { + "DropZoneProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RequiredGridItemProps", - "value": "Required", - "description": "Represents the grid item component props with all properties marked as required.", + "name": "DropZoneProps", + "description": "*", "isPublicDocs": true, "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accept", + "value": "string", + "description": "A string representing the types of files that are accepted by the drop zone. This string is a comma-separated list of unique file type specifiers which can be one of the following:\n- A file extension starting with a period (\".\") character (e.g. .jpg, .pdf, .doc)\n- A valid MIME type string with no extensions\n\nIf omitted, all file types are accepted.", + "isOptional": true, + "defaultValue": "''" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the item. When set, it will be announced to buyers using assistive technologies and will provide them with more context.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityRole", - "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", "isOptional": true, - "defaultValue": "'generic'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityVisibility", - "value": "'visible' | 'hidden' | 'exclusive'", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", - "isOptional": true, - "defaultValue": "'visible'" + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "background", - "value": "BackgroundColorKeyword", - "description": "The background color of the element. Use `transparent` for no background, `subdued` for a subtle background, `base` for standard background, or `strong` for a prominent background.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", + "name": "files", + "value": "ReadonlyArray", + "description": "An array of File objects representing the files currently selected by the user.\n\nThis property is read-only and cannot be directly modified. To clear the selected files, set the `value` prop to an empty string or null.", "isOptional": true, - "defaultValue": "'transparent'" + "defaultValue": "[]" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blockSize", - "value": "MaybeResponsive", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about the [block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "border", - "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.\n\nAccepts a size value, optionally followed by a color, optionally followed by a style. Omitted values use defaults: color defaults to `base`, style defaults to `auto`.\n\nIndividual properties (`borderWidth`, `borderStyle`, `borderColor`) can override values set here.", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderColor", - "value": "ColorKeyword | ''", - "description": "The color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "name": "multiple", + "value": "boolean", + "description": "Whether multiple files can be selected or dropped at once.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- One value: applies to all corners\n- Two values: applies to start corners (top-left & bottom-right) and end corners (top-right & bottom-left) respectively\n- Three values: applies to start-start (top-left), end corners (top-right & bottom-left), and end-end (bottom-right) respectively\n- Four values: applies to start-start (top-left), start-end (top-right), end-end (bottom-right), and end-start (bottom-left) respectively\n\nExamples:\n- `small-100`: All corners have `small-100` radius\n- `small-100 none`: Top-left and bottom-right are `small-100`, top-right and bottom-left are `none`\n- `small-100 none large-100`: Top-left is `small-100`, top-right and bottom-left are `none`, bottom-right is `large-100`\n- `small-100 none large-100 base`: Each corner has its specified radius value", - "isOptional": true, - "defaultValue": "'none'" + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderStyle", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted.\n\nWhen set, this overrides the style value specified in the `border` property.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different styles per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderWidth", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", + "name": "value", + "value": "string", + "description": "A string that represents the path to the selected file(s). If no file is selected yet, the value is an empty string (\"\"). When the user selected multiple files, the value represents the first file in the list of files they selected. The value is always the file's name prefixed with \"C:\\fakepath\\\", which isn't the real path of the file.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "''" + } + ], + "value": "export interface DropZoneProps\n extends Required<\n Pick<\n DropZoneProps$1,\n | 'accept'\n | 'accessibilityLabel'\n | 'disabled'\n | 'files'\n | 'name'\n | 'error'\n | 'label'\n | 'labelAccessibilityVisibility'\n | 'multiple'\n | 'required'\n | 'value'\n >\n > {}" + } + }, + "EmailFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "EmailFieldProps", + "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required>", + "description": "The properties for the email field component. These properties configure a specialized text input field for entering email addresses with built-in validation and appropriate keyboard support.", + "isPublicDocs": true + } + }, + "EmailFieldJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "EmailFieldJSXProps", + "description": "The JSX props for the email field component. These properties extend `EmailFieldProps` with JSX-specific event callbacks for React-style event handling.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The content displayed within the box component, which serves as a flexible container for organizing and styling other components.", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "display", - "value": "MaybeResponsive<'auto' | 'none'>", - "description": "The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n\nLearn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).", - "isOptional": true, - "defaultValue": "'auto'" + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gridColumn", - "value": "`span ${number}` | 'auto'", - "description": "The number of columns the item will span across.\n\nLearn more about the [grid-column property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gridRow", - "value": "`span ${number}` | 'auto'", - "description": "The number of rows the item will span across.\n\nLearn more about the [grid-row property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).", - "isOptional": true, - "defaultValue": "'auto'" + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "inlineSize", - "value": "MaybeResponsive", - "description": "The horizontal size of the element in standard layouts (width in left-to-right or right-to-left writing modes).\n\nInline size adjusts based on the writing direction: in horizontal layouts, it controls the width; in vertical layouts, it controls the height. This ensures consistent behavior across different text directions.\n\nLearn more about the [inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxBlockSize", - "value": "MaybeResponsive", - "description": "The maximum vertical size of the element in standard layouts (max-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the block axis.\n\nLearn more about the [max-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxInlineSize", - "value": "MaybeResponsive", - "description": "The maximum horizontal size of the element in standard layouts (max-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the inline axis.\n\nLearn more about the [max-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "name": "maxLength", + "value": "number", + "description": "Specifies the maximum number of characters allowed.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "Infinity" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minBlockSize", - "value": "MaybeResponsive", - "description": "The minimum vertical size of the element in standard layouts (min-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the block axis.\n\nLearn more about the [min-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "name": "minLength", + "value": "number", + "description": "Specifies the min number of characters allowed.", "isOptional": true, - "defaultValue": "'0'" + "defaultValue": "0" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minInlineSize", - "value": "MaybeResponsive", - "description": "The minimum horizontal size of the element in standard layouts (min-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the inline axis.\n\nLearn more about the [min-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", - "isOptional": true, - "defaultValue": "'0'" + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "overflow", - "value": "'hidden' | 'visible'", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", - "isOptional": true, - "defaultValue": "'visible'" + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "padding", - "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding.", - "isOptional": true, - "defaultValue": "'none'" - }, + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user has finished editing the field, such as when they blur the field.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlock", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockEnd", - "value": "MaybeResponsive", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user makes changes to the field value. This fires before `onChange`.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockStart", - "value": "MaybeResponsive", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInline", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`.", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineEnd", - "value": "MaybeResponsive", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`.", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineStart", - "value": "MaybeResponsive", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", + "isOptional": true } - ] + ], + "value": "export interface EmailFieldJSXProps\n extends Partial>,\n Pick,\n FieldReactProps,\n FieldSlotInternalReactProps {}" } }, - "RequiredLinkProps": { + "RequiredAlignedProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", - "name": "RequiredLinkProps", - "value": "Required", - "description": "Represents the link component props with all properties marked as required.", + "name": "RequiredAlignedProps", + "value": "Required", + "description": "A version of the grid properties with all fields required.", "isPublicDocs": true, "members": [ { @@ -18170,1090 +19588,5889 @@ "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The text or elements displayed within the link component, which navigates users to a different location when activated.", - "isOptional": true + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "'--auto'" + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", - "isOptional": true + "name": "alignContent", + "value": "MaybeResponsive", + "description": "Aligns the grid along the block (column) axis.\n\nThis overrides the block value of `placeContent`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "download", - "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", - "isOptional": true + "name": "alignItems", + "value": "MaybeResponsive", + "description": "Aligns the grid items along the block (column) axis.\n\nThis overrides the block value of `placeItems`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "href", - "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", - "isOptional": true + "name": "background", + "value": "BackgroundColorKeyword", + "description": "Adjust the background of the element.", + "isOptional": true, + "defaultValue": "'transparent'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", - "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", - "isOptional": true + "name": "blockSize", + "value": "MaybeResponsive", + "description": "Adjust the block size.", + "isOptional": true, + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", - "isOptional": true + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "lang", - "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry).", - "isOptional": true + "name": "borderColor", + "value": "ColorKeyword | ''", + "description": "Set the color of the border.\n\nIf set, it takes precedence over the `border` property's color.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onBlur", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", - "isOptional": true + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Set the radius of the border.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `start-start start-end end-end end-start`\n- 3 values: `start-start (start-end & end-start) start-end`\n- 2 values: `(start-start & end-end) (start-end & end-start)`\n\nFor example:\n- `small-100` means start-start, start-end, end-end and end-start border radii are `small-100`.\n- `small-100 none` means start-start and end-end border radii are `small-100`, start-end and end-start border radii are `none`.\n- `small-100 none large-100` means start-start border radius is `small-100`, start-end border radius is `none`, end-end border radius is `large-100` and end-start border radius is `none`.\n- `small-100 none large-100 small-100` means start-start border radius is `small-100`, start-end border radius is `none`, end-end border radius is `large-100` and end-start border radius is `small-100`.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onClick", - "value": "(event: Event) => void", - "description": "A callback fired when the link is activated, before navigating to the location specified by `href`. Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", - "isOptional": true + "name": "borderStyle", + "value": "MaybeAllValuesShorthandProperty | ''", + "description": "Set the style of the border.\n\nIf set, it takes precedence over the `border` property's style.\n\nLike CSS, up to 4 values can be specified.\n\nIf one value is specified, it applies to all sides.\n\nIf two values are specified, they apply to the block sides and inline sides respectively.\n\nIf three values are specified, they apply to the block-start, both inline sides, and block-end respectively.\n\nIf four values are specified, they apply to the block-start, block-end, inline-start, and inline-end sides respectively.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onFocus", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "name": "borderWidth", + "value": "MaybeAllValuesShorthandProperty | ''", + "description": "Set the width of the border.\n\nIf set, it takes precedence over the `border` property's width.\n\nLike CSS, up to 4 values can be specified.\n\nIf one value is specified, it applies to all sides.\n\nIf two values are specified, they apply to the block sides and inline sides respectively.\n\nIf three values are specified, they apply to the block-start, both inline sides, and block-end respectively.\n\nIf four values are specified, they apply to the block-start, block-end, inline-start, and inline-end sides respectively.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Box.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "target", - "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "name": "columnGap", + "value": "MaybeResponsive", + "description": "Adjust spacing between elements in the inline axis.\n\nThis overrides the column value of `gap`.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "tone", - "value": "ToneKeyword", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", + "name": "display", + "value": "MaybeResponsive<'auto' | 'none'>", + "description": "Sets the outer display type of the component. The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", "isOptional": true, "defaultValue": "'auto'" - } - ] - } - }, - "LinkBaseProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "LinkBaseProps", - "value": "Required<\n Pick<\n LinkProps$1,\n | 'accessibilityLabel'\n | 'command'\n | 'commandFor'\n | 'interestFor'\n | 'download'\n | 'href'\n | 'lang'\n | 'target'\n | 'tone'\n >\n>", - "description": "Represents the base link props with all core properties marked as required.", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", - "isOptional": true + "name": "gap", + "value": "MaybeResponsive>", + "description": "Adjust spacing between elements.\n\nA single value applies to both axes. A pair of values (eg `large-100 large-500`) can be used to set the inline and block axes respectively.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", + "name": "gridTemplateColumns", + "value": "MaybeResponsive", + "description": "Define columns and specify their size.", "isOptional": true, - "defaultValue": "'--auto'" + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", - "isOptional": true + "name": "gridTemplateRows", + "value": "MaybeResponsive", + "description": "Define rows and specify their size.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "download", + "name": "id", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "href", - "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", - "isOptional": true + "name": "inlineSize", + "value": "MaybeResponsive", + "description": "Adjust the inline size.", + "isOptional": true, + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", - "isOptional": true + "name": "justifyContent", + "value": "MaybeResponsive", + "description": "Aligns the grid along the inline (row) axis.\n\nThis overrides the inline value of `placeContent`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "lang", - "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry).", - "isOptional": true + "name": "justifyItems", + "value": "MaybeResponsive", + "description": "Aligns the grid items along the inline (row) axis.\n\nThis overrides the inline value of `placeItems`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "target", - "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "name": "maxBlockSize", + "value": "MaybeResponsive", + "description": "Adjust the maximum block size.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "tone", - "value": "ToneKeyword", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", + "name": "maxInlineSize", + "value": "MaybeResponsive", + "description": "Adjust the maximum inline size.", "isOptional": true, - "defaultValue": "'auto'" - } - ] - } - }, - "PolyfillCommandEventInit": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "PolyfillCommandEventInit", - "value": "EventInit & {\n source: HTMLElement | null | undefined;\n command: PreactOverlayControlProps['command'];\n}", - "description": "Represents the initialization object for creating a polyfill command event. Used for overlay control commands in environments that require polyfills.", - "isPublicDocs": true - } - }, - "PreactOverlayControlProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "PreactOverlayControlProps", - "description": "", - "members": [ + "defaultValue": "'none'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", - "defaultValue": "'--auto'" + "name": "minBlockSize", + "value": "MaybeResponsive", + "description": "Adjust the minimum block size.", + "isOptional": true, + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "name": "minInlineSize", + "value": "MaybeResponsive", + "description": "Adjust the minimum inline size.", + "isOptional": true, + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." - } - ], - "value": "export interface PreactOverlayControlProps\n extends Pick {\n /**\n * The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n *\n * - `--auto`: A default action for the target component.\n * - `--show`: Shows the target component.\n * - `--hide`: Hides the target component.\n * - `--toggle`: Toggles the visibility of the target component.\n *\n * @default '--auto'\n */\n command: Extract<\n InteractionProps['command'],\n '--show' | '--hide' | '--toggle' | '--auto'\n >;\n /**\n * The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated.\n */\n commandFor: Extract;\n /**\n * The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.\n */\n interestFor: Extract;\n}" - } - }, - "PolyfillCommandEvent": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "PolyfillCommandEvent", - "value": "Event & {\n source: PolyfillCommandEventInit['source'];\n command: PolyfillCommandEventInit['command'];\n /** Have to use `_s_shadowSource` because `source` is retargeted to the shadow host by browsers */\n _s_shadowSource: PolyfillCommandEventInit['source'];\n}", - "description": "Represents a polyfill command event for overlay controls. Used in environments where native command events are not available.", - "isPublicDocs": true - } - }, - "RequiredAlignedModalProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RequiredAlignedModalProps", - "value": "Required", - "description": "Represents the modal component props with all properties marked as required.", - "isPublicDocs": true, - "members": [ + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose of the modal. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nThis overrides the `heading` prop for screen readers.", - "isOptional": true + "name": "padding", + "value": "MaybeResponsive>", + "description": "Adjust the padding of all edges.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `block-start inline-end block-end inline-start`\n- 3 values: `block-start inline block-end`\n- 2 values: `block inline`\n\nFor example:\n- `large` means block-start, inline-end, block-end and inline-start paddings are `large`.\n- `large none` means block-start and block-end paddings are `large`, inline-start and inline-end paddings are `none`.\n- `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`.\n- `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`.\n\nA padding value of `auto` will use the default padding for the closest container that has had its usual padding removed.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The content of the modal.", - "isOptional": true + "name": "paddingBlock", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the block-padding.\n\n- `large none` means block-start padding is `large`, block-end padding is `none`.\n\nThis overrides the block value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "heading", - "value": "string", - "description": "A title that describes the content of the modal.", - "isOptional": true + "name": "paddingBlockEnd", + "value": "MaybeResponsive", + "description": "Adjust the block-end padding.\n\nThis overrides the block-end value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "hideOverlay", - "value": "() => void", - "description": "A method to programmatically hide the overlay." + "name": "paddingBlockStart", + "value": "MaybeResponsive", + "description": "Adjust the block-start padding.\n\nThis overrides the block-start value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", - "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", - "isOptional": true + "name": "paddingInline", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the inline padding.\n\n- `large none` means inline-start padding is `large`, inline-end padding is `none`.\n\nThis overrides the inline value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onAfterHide", - "value": "(event: Event) => void", - "description": "A callback fired when the overlay is hidden, after any hide animations have completed.", - "isOptional": true + "name": "paddingInlineEnd", + "value": "MaybeResponsive", + "description": "Adjust the inline-end padding.\n\nThis overrides the inline-end value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onAfterShow", - "value": "(event: Event) => void", - "description": "A callback fired when the overlay is shown, after any show animations have completed.", - "isOptional": true + "name": "paddingInlineStart", + "value": "MaybeResponsive", + "description": "Adjust the inline-start padding.\n\nThis overrides the inline-start value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onHide", - "value": "(event: Event) => void", - "description": "A callback fired immediately after the overlay is hidden.", - "isOptional": true + "name": "placeContent", + "value": "MaybeResponsive<\n `${AlignContentKeyword} ${JustifyContentKeyword}` | AlignContentKeyword\n >", + "description": "A shorthand property for `justify-content` and `align-content`.", + "isOptional": true, + "defaultValue": "'normal normal'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onShow", - "value": "(event: Event) => void", - "description": "A callback fired immediately after the overlay is shown.", - "isOptional": true + "name": "placeItems", + "value": "MaybeResponsive<\n `${AlignItemsKeyword} ${JustifyItemsKeyword}` | AlignItemsKeyword\n >", + "description": "A shorthand property for `justify-items` and `align-items`.", + "isOptional": true, + "defaultValue": "'normal normal'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "padding", - "value": "'base' | 'none'", - "description": "Adjust the padding around the modal content.\n\n`base`: applies padding that is appropriate for the element.\n\n`none`: removes all padding from the element. This can be useful when elements inside the modal need to span to the edge of the modal. For example, a full-width image. In this case, rely on box with a padding of 'base' to bring back the desired padding for the rest of the content.", + "name": "rowGap", + "value": "MaybeResponsive", + "description": "Adjust spacing between elements in the block axis.\n\nThis overrides the row value of `gap`.", "isOptional": true, - "defaultValue": "'base'" - }, + "defaultValue": "'' - meaning no override" + } + ] + } + }, + "ResponsiveGridProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "ResponsiveGridProps", + "value": "MakeResponsivePick<\n RequiredAlignedProps,\n 'rowGap' | 'columnGap' | 'gap' | 'gridTemplateColumns' | 'gridTemplateRows'\n>", + "description": "The grid properties that support responsive values through container queries.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "primaryAction", - "value": "ComponentChildren", - "description": "The primary action button or link, representing the main or most important action available in this context. Typically displayed with higher visual prominence than secondary actions to establish clear hierarchy.", - "isOptional": true + "name": "columnGap", + "value": "MaybeResponsive", + "description": "Adjust spacing between elements in the inline axis.\n\nThis overrides the column value of `gap`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondaryActions", - "value": "ComponentChildren", - "description": "Additional action buttons or links that provide alternative or supporting actions. Visually de-emphasized compared to the primary action.", - "isOptional": true + "name": "gap", + "value": "MaybeResponsive>", + "description": "Adjust spacing between elements.\n\nA single value applies to both axes. A pair of values (eg `large-100 large-500`) can be used to set the inline and block axes respectively.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "showOverlay", - "value": "() => void", - "description": "A method to programmatically show the overlay." + "name": "gridTemplateColumns", + "value": "MaybeResponsive", + "description": "Define columns and specify their size.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "size", - "value": "SizeKeyword | 'max'", - "description": "Adjust the size of the modal.\n\n`max`: expands the modal to its maximum size as defined by the host application, on both the horizontal and vertical axes.", + "name": "gridTemplateRows", + "value": "MaybeResponsive", + "description": "Define rows and specify their size.", "isOptional": true, - "defaultValue": "'base'" + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "toggleOverlay", - "value": "() => void", - "description": "A method to programmatically toggle the visibility of the overlay." + "name": "rowGap", + "value": "MaybeResponsive", + "description": "Adjust spacing between elements in the block axis.\n\nThis overrides the row value of `gap`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" } ] } }, - "ContextCallback": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ContextCallback", - "description": "A callback which is provided by a context requester and is called with the value satisfying the request. This callback can be called multiple times by context providers as the requested value is changed.", - "isPublicDocs": true, - "params": [ - { - "name": "value", - "description": "", - "value": "T", - "filePath": "src/surfaces/admin/components.ts" - } - ], - "returns": { - "filePath": "src/surfaces/admin/components.ts", - "description": "", - "name": "void", - "value": "void" - }, - "value": "(value: T) => void" - } - }, - "Modal": { + "GridProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "Modal", - "description": "Configure the following properties on the modal component.", + "name": "GridProps", + "description": "The properties for the grid component. A grid provides precise control over rows and columns, with powerful alignment and sizing options for both individual items and the entire grid structure.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", + "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose of the modal. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nThis overrides the `heading` prop for screen readers." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "heading", - "value": "string", - "description": "A title that describes the content of the modal." + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "padding", - "value": "\"base\" | \"none\"", - "description": "Adjust the padding around the modal content.\n\n`base`: applies padding that is appropriate for the element.\n\n`none`: removes all padding from the element. This can be useful when elements inside the modal need to span to the edge of the modal. For example, a full-width image. In this case, rely on box with a padding of 'base' to bring back the desired padding for the rest of the content.", - "defaultValue": "'base'" + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "size", - "value": "\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the modal component, controlling its width and height. Larger sizes provide more space for content while smaller sizes are more compact.", - "defaultValue": "'base'" + "syntaxKind": "PropertySignature", + "name": "alignContent", + "value": "AlignContentKeyword | ''", + "description": "The alignment of the entire grid along the block axis when there's extra space in the grid container. This property overrides the block-axis value set by the `placeContent` property.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "showOverlay", - "value": "() => void", - "description": "A method to programmatically show the overlay." + "syntaxKind": "PropertySignature", + "name": "alignItems", + "value": "AlignItemsKeyword | ''", + "description": "The alignment of grid items along the block axis (vertical in horizontal writing modes). You can choose values like `'start'`, `'center'`, `'end'`, or `'stretch'` to control how items are positioned within their grid areas.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "hideOverlay", - "value": "() => void", - "description": "A method to programmatically hide the overlay." + "syntaxKind": "PropertySignature", + "name": "background", + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", + "defaultValue": "'transparent'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "toggleOverlay", - "value": "() => void", - "description": "A method to programmatically toggle the visibility of the overlay." + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@abortController@2658", - "value": "AbortController", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@dialog@2652", - "value": "HTMLDialogElement", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@focusedElement@2654", - "value": "HTMLElement", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@nestedModals@2656", - "value": "Map", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "columnGap", + "value": "MaybeResponsive<\"\" | SpacingKeyword>", + "description": "The spacing between grid columns. This property overrides the column spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@childrenRerenderObserver@2660", - "value": "MutationObserver", - "description": "", - "isPrivate": true - }, + "syntaxKind": "PropertySignature", + "name": "display", + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gap", + "value": "MaybeResponsive>", + "description": "The spacing between grid rows and columns. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value to apply the same spacing to both axes (for example, `'large-100'`), or a pair of values (for example, `'large-100 large-500'`) to set different spacing for rows and columns. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridTemplateColumns", + "value": "string", + "description": "The number of columns and their sizes. You can use [track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes) (for example, `'1fr auto'` or `'repeat(3, 1fr)'`) to define the grid structure. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridTemplateRows", + "value": "string", + "description": "The number of rows and their sizes. You can use [track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes) (for example, `'1fr auto'` or `'repeat(3, 100px)'`) to define the grid structure. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "justifyContent", + "value": "JustifyContentKeyword | ''", + "description": "The alignment of the entire grid along the inline axis when there's extra space in the grid container. This property overrides the inline-axis value set by the `placeContent` property.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "justifyItems", + "value": "JustifyItemsKeyword | ''", + "description": "The alignment of grid items along the inline axis (horizontal in left-to-right languages). You can choose values like `'start'`, `'center'`, or `'end'` to control how items are positioned within their grid areas.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "MaybeResponsive>", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlock", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInline", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeContent", + "value": "| `${AlignContentKeyword} ${JustifyContentKeyword}`\n | AlignContentKeyword", + "description": "A shorthand property for setting both `justifyContent` and `alignContent` at once. You can provide either a single value (which applies to both axes) or two values separated by a space (the first for `alignContent`, the second for `justifyContent`).", + "defaultValue": "'normal normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeItems", + "value": "`${AlignItemsKeyword} ${JustifyItemsKeyword}` | AlignItemsKeyword", + "description": "A shorthand property for setting both `justifyItems` and `alignItems` at once. You can provide either a single value (which applies to both axes) or two values separated by a space (the first for `alignItems`, the second for `justifyItems`).", + "defaultValue": "'normal normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "rowGap", + "value": "MaybeResponsive<\"\" | SpacingKeyword>", + "description": "The spacing between grid rows. This property overrides the row spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'' - meaning no override" + } + ], + "value": "export interface GridProps\n extends BoxProps,\n Required<\n Pick<\n GridProps$1,\n | 'alignItems'\n | 'justifyItems'\n | 'placeItems'\n | 'alignContent'\n | 'justifyContent'\n | 'placeContent'\n >\n > {\n /**\n * The alignment of grid items along the block axis (vertical in horizontal writing modes). You can choose values like `'start'`, `'center'`, `'end'`, or `'stretch'` to control how items are positioned within their grid areas.\n *\n * @default '' - meaning no override\n */\n alignItems: AlignItemsKeyword | '';\n /**\n * The alignment of grid items along the inline axis (horizontal in left-to-right languages). You can choose values like `'start'`, `'center'`, or `'end'` to control how items are positioned within their grid areas.\n *\n * @default '' - meaning no override\n */\n justifyItems: JustifyItemsKeyword | '';\n /**\n * A shorthand property for setting both `justifyItems` and `alignItems` at once. You can provide either a single value (which applies to both axes) or two values separated by a space (the first for `alignItems`, the second for `justifyItems`).\n *\n * @default 'normal normal'\n */\n placeItems: `${AlignItemsKeyword} ${JustifyItemsKeyword}` | AlignItemsKeyword;\n /**\n * The alignment of the entire grid along the block axis when there's extra space in the grid container. This property overrides the block-axis value set by the `placeContent` property.\n *\n * @default '' - meaning no override\n */\n alignContent: AlignContentKeyword | '';\n /**\n * The alignment of the entire grid along the inline axis when there's extra space in the grid container. This property overrides the inline-axis value set by the `placeContent` property.\n *\n * @default '' - meaning no override\n */\n justifyContent: JustifyContentKeyword | '';\n /**\n * A shorthand property for setting both `justifyContent` and `alignContent` at once. You can provide either a single value (which applies to both axes) or two values separated by a space (the first for `alignContent`, the second for `justifyContent`).\n *\n * @default 'normal normal'\n */\n placeContent:\n | `${AlignContentKeyword} ${JustifyContentKeyword}`\n | AlignContentKeyword;\n /**\n * The spacing between grid rows and columns. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value to apply the same spacing to both axes (for example, `'large-100'`), or a pair of values (for example, `'large-100 large-500'`) to set different spacing for rows and columns. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default 'none'\n */\n gap: ResponsiveGridProps['gap'];\n /**\n * The spacing between grid rows. This property overrides the row spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default '' - meaning no override\n */\n rowGap: ResponsiveGridProps['rowGap'];\n /**\n * The spacing between grid columns. This property overrides the column spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default '' - meaning no override\n */\n columnGap: ResponsiveGridProps['columnGap'];\n /**\n * The number of columns and their sizes. You can use [track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes) (for example, `'1fr auto'` or `'repeat(3, 1fr)'`) to define the grid structure. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default 'none'\n */\n gridTemplateColumns: ResponsiveGridProps['gridTemplateColumns'];\n /**\n * The number of rows and their sizes. You can use [track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes) (for example, `'1fr auto'` or `'repeat(3, 100px)'`) to define the grid structure. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default 'none'\n */\n gridTemplateRows: ResponsiveGridProps['gridTemplateRows'];\n}" + } + }, + "GridJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "GridJSXProps", + "description": "The properties for the grid component when it's used in JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "alignContent", + "value": "AlignContentKeyword | ''", + "description": "The alignment of the entire grid along the block axis when there's extra space in the grid container. This property overrides the block-axis value set by the `placeContent` property.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "alignItems", + "value": "AlignItemsKeyword | ''", + "description": "The alignment of grid items along the block axis (vertical in horizontal writing modes). You can choose values like `'start'`, `'center'`, `'end'`, or `'stretch'` to control how items are positioned within their grid areas.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "background", + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", + "defaultValue": "'transparent'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The child elements to render inside the grid.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "columnGap", + "value": "MaybeResponsive<\"\" | SpacingKeyword>", + "description": "The spacing between grid columns. This property overrides the column spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "display", + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gap", + "value": "MaybeResponsive>", + "description": "The spacing between grid rows and columns. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value to apply the same spacing to both axes (for example, `'large-100'`), or a pair of values (for example, `'large-100 large-500'`) to set different spacing for rows and columns. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridTemplateColumns", + "value": "string", + "description": "The number of columns and their sizes. You can use [track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes) (for example, `'1fr auto'` or `'repeat(3, 1fr)'`) to define the grid structure. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridTemplateRows", + "value": "string", + "description": "The number of rows and their sizes. You can use [track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes) (for example, `'1fr auto'` or `'repeat(3, 100px)'`) to define the grid structure. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "justifyContent", + "value": "JustifyContentKeyword | ''", + "description": "The alignment of the entire grid along the inline axis when there's extra space in the grid container. This property overrides the inline-axis value set by the `placeContent` property.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "justifyItems", + "value": "JustifyItemsKeyword | ''", + "description": "The alignment of grid items along the inline axis (horizontal in left-to-right languages). You can choose values like `'start'`, `'center'`, or `'end'` to control how items are positioned within their grid areas.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "MaybeResponsive>", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlock", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInline", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeContent", + "value": "| `${AlignContentKeyword} ${JustifyContentKeyword}`\n | AlignContentKeyword", + "description": "A shorthand property for setting both `justifyContent` and `alignContent` at once. You can provide either a single value (which applies to both axes) or two values separated by a space (the first for `alignContent`, the second for `justifyContent`).", + "defaultValue": "'normal normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeItems", + "value": "`${AlignItemsKeyword} ${JustifyItemsKeyword}` | AlignItemsKeyword", + "description": "A shorthand property for setting both `justifyItems` and `alignItems` at once. You can provide either a single value (which applies to both axes) or two values separated by a space (the first for `alignItems`, the second for `justifyItems`).", + "defaultValue": "'normal normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "rowGap", + "value": "MaybeResponsive<\"\" | SpacingKeyword>", + "description": "The spacing between grid rows. This property overrides the row spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'' - meaning no override" + } + ], + "value": "export interface GridJSXProps\n extends Partial,\n Pick {\n /**\n * The child elements to render inside the grid.\n */\n children?: ComponentChildren;\n}" + } + }, + "RequiredGridItemProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "RequiredGridItemProps", + "value": "Required", + "description": "A version of the grid item properties with all fields required.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "background", + "value": "BackgroundColorKeyword", + "description": "Adjust the background of the element.", + "isOptional": true, + "defaultValue": "'transparent'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "MaybeResponsive", + "description": "Adjust the block size.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "ColorKeyword | ''", + "description": "Set the color of the border.\n\nIf set, it takes precedence over the `border` property's color.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Set the radius of the border.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `start-start start-end end-end end-start`\n- 3 values: `start-start (start-end & end-start) start-end`\n- 2 values: `(start-start & end-end) (start-end & end-start)`\n\nFor example:\n- `small-100` means start-start, start-end, end-end and end-start border radii are `small-100`.\n- `small-100 none` means start-start and end-end border radii are `small-100`, start-end and end-start border radii are `none`.\n- `small-100 none large-100` means start-start border radius is `small-100`, start-end border radius is `none`, end-end border radius is `large-100` and end-start border radius is `none`.\n- `small-100 none large-100 small-100` means start-start border radius is `small-100`, start-end border radius is `none`, end-end border radius is `large-100` and end-start border radius is `small-100`.", + "isOptional": true, + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "MaybeAllValuesShorthandProperty | ''", + "description": "Set the style of the border.\n\nIf set, it takes precedence over the `border` property's style.\n\nLike CSS, up to 4 values can be specified.\n\nIf one value is specified, it applies to all sides.\n\nIf two values are specified, they apply to the block sides and inline sides respectively.\n\nIf three values are specified, they apply to the block-start, both inline sides, and block-end respectively.\n\nIf four values are specified, they apply to the block-start, block-end, inline-start, and inline-end sides respectively.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "MaybeAllValuesShorthandProperty | ''", + "description": "Set the width of the border.\n\nIf set, it takes precedence over the `border` property's width.\n\nLike CSS, up to 4 values can be specified.\n\nIf one value is specified, it applies to all sides.\n\nIf two values are specified, they apply to the block sides and inline sides respectively.\n\nIf three values are specified, they apply to the block-start, both inline sides, and block-end respectively.\n\nIf four values are specified, they apply to the block-start, block-end, inline-start, and inline-end sides respectively.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Box.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "display", + "value": "MaybeResponsive<'auto' | 'none'>", + "description": "Sets the outer display type of the component. The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridColumn", + "value": "`span ${number}` | 'auto'", + "description": "Number of columns the item will span across", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridRow", + "value": "`span ${number}` | 'auto'", + "description": "Number of rows the item will span across", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "MaybeResponsive", + "description": "Adjust the inline size.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "MaybeResponsive", + "description": "Adjust the maximum block size.", + "isOptional": true, + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "MaybeResponsive", + "description": "Adjust the maximum inline size.", + "isOptional": true, + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "MaybeResponsive", + "description": "Adjust the minimum block size.", + "isOptional": true, + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "MaybeResponsive", + "description": "Adjust the minimum inline size.", + "isOptional": true, + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "MaybeResponsive>", + "description": "Adjust the padding of all edges.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `block-start inline-end block-end inline-start`\n- 3 values: `block-start inline block-end`\n- 2 values: `block inline`\n\nFor example:\n- `large` means block-start, inline-end, block-end and inline-start paddings are `large`.\n- `large none` means block-start and block-end paddings are `large`, inline-start and inline-end paddings are `none`.\n- `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`.\n- `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`.\n\nA padding value of `auto` will use the default padding for the closest container that has had its usual padding removed.", + "isOptional": true, + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlock", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the block-padding.\n\n- `large none` means block-start padding is `large`, block-end padding is `none`.\n\nThis overrides the block value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockEnd", + "value": "MaybeResponsive", + "description": "Adjust the block-end padding.\n\nThis overrides the block-end value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockStart", + "value": "MaybeResponsive", + "description": "Adjust the block-start padding.\n\nThis overrides the block-start value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInline", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the inline padding.\n\n- `large none` means inline-start padding is `large`, inline-end padding is `none`.\n\nThis overrides the inline value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineEnd", + "value": "MaybeResponsive", + "description": "Adjust the inline-end padding.\n\nThis overrides the inline-end value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineStart", + "value": "MaybeResponsive", + "description": "Adjust the inline-start padding.\n\nThis overrides the inline-start value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + } + ] + } + }, + "GridItemProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "GridItemProps", + "description": "The properties for the grid item component. A grid item can be positioned within specific rows and columns of a grid, with control over how many rows or columns it spans.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "background", + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", + "defaultValue": "'transparent'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "display", + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridColumn", + "value": "\"auto\" | `span ${number}`", + "description": "The column position and span of the grid item. You can specify a starting column number, an ending column number, or both (for example, `'1 / 3'` starts at column 1 and ends before column 3, spanning 2 columns). You can also use `'span 2'` to make the item span 2 columns.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridRow", + "value": "\"auto\" | `span ${number}`", + "description": "The row position and span of the grid item. You can specify a starting row number, an ending row number, or both (for example, `'1 / 3'` starts at row 1 and ends before row 3, spanning 2 rows). You can also use `'span 2'` to make the item span 2 rows.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "MaybeResponsive>", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlock", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInline", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + } + ], + "value": "export interface GridItemProps\n extends BoxProps,\n Required> {\n /**\n * The column position and span of the grid item. You can specify a starting column number, an ending column number, or both (for example, `'1 / 3'` starts at column 1 and ends before column 3, spanning 2 columns). You can also use `'span 2'` to make the item span 2 columns.\n */\n gridColumn: RequiredGridItemProps['gridColumn'];\n /**\n * The row position and span of the grid item. You can specify a starting row number, an ending row number, or both (for example, `'1 / 3'` starts at row 1 and ends before row 3, spanning 2 rows). You can also use `'span 2'` to make the item span 2 rows.\n */\n gridRow: RequiredGridItemProps['gridRow'];\n}" + } + }, + "GridItemJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "GridItemJSXProps", + "description": "The properties for the grid item component when it's used in JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "background", + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", + "defaultValue": "'transparent'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The child elements to render inside the grid item.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "display", + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridColumn", + "value": "\"auto\" | `span ${number}`", + "description": "The column position and span of the grid item. You can specify a starting column number, an ending column number, or both (for example, `'1 / 3'` starts at column 1 and ends before column 3, spanning 2 columns). You can also use `'span 2'` to make the item span 2 columns.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridRow", + "value": "\"auto\" | `span ${number}`", + "description": "The row position and span of the grid item. You can specify a starting row number, an ending row number, or both (for example, `'1 / 3'` starts at row 1 and ends before row 3, spanning 2 rows). You can also use `'span 2'` to make the item span 2 rows.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "MaybeResponsive>", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlock", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInline", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + } + ], + "value": "export interface GridItemJSXProps\n extends Partial,\n Pick {\n /**\n * The child elements to render inside the grid item.\n */\n children?: ComponentChildren;\n}" + } + }, + "HeadingProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "HeadingProps", + "description": "The properties for the heading component. These properties define hierarchical section titles and headings with appropriate semantic meaning and visual hierarchy.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "'none' | 'presentation' | 'heading'", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `heading`: defines the element as a heading to a page or section.\n- `presentation`: the heading level will be stripped, and will prevent the element’s implicit ARIA semantics from being exposed to the accessibility tree.\n- `none`: a synonym for the `presentation` role.", + "isOptional": true, + "defaultValue": "'heading'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "lineClamp", + "value": "number", + "description": "Truncates the text content to the specified number of lines.", + "isOptional": true, + "defaultValue": "Infinity - no truncation is applied" + } + ], + "value": "export interface HeadingProps\n extends Required<\n Pick<\n HeadingProps$1,\n 'accessibilityRole' | 'accessibilityVisibility' | 'lineClamp'\n >\n > {}" + } + }, + "HeadingJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "HeadingJSXProps", + "description": "The JSX properties for the heading component. These properties define how a heading is rendered in Preact or JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "'none' | 'presentation' | 'heading'", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `heading`: defines the element as a heading to a page or section.\n- `presentation`: the heading level will be stripped, and will prevent the element’s implicit ARIA semantics from being exposed to the accessibility tree.\n- `none`: a synonym for the `presentation` role.", + "isOptional": true, + "defaultValue": "'heading'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the heading.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "lineClamp", + "value": "number", + "description": "Truncates the text content to the specified number of lines.", + "isOptional": true, + "defaultValue": "Infinity - no truncation is applied" + } + ], + "value": "export interface HeadingJSXProps\n extends Partial,\n Pick {\n /**\n * The content of the heading.\n */\n children?: ComponentChildren;\n}" + } + }, + "IconJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "IconJSXProps", + "description": "The properties for the icon component when it's used in JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "color", + "value": "'base' | 'subdued'", + "description": "The color emphasis of the icon. Use `'base'` for the standard color intensity, or `'subdued'` for a lighter, less prominent appearance.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "size", + "value": "'small' | 'base'", + "description": "The size of the icon. Use `'small'` for compact layouts, or `'base'` for standard sizing.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto' | 'neutral' | 'caution'", + "description": "The color tone of the icon based on its semantic meaning. Choose from `'auto'` to let the icon inherit its context, `'neutral'` for standard icons, `'info'` for informational content, `'success'` for positive actions, `'caution'` or `'warning'` for warnings, or `'critical'` for errors.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "type", + "value": "'' | IconType | 'empty'", + "description": "The type of icon that will be displayed. You can specify an icon name from the available icon set, or use an empty string to show no icon." + } + ], + "value": "export interface IconJSXProps\n extends Partial,\n Pick {}" + } + }, + "ImageProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ImageProps", + "description": "The properties for the image component. An image displays pictures with configurable sizing, loading behavior, and borders. Properties include `src` for the image URL, `alt` for accessibility text, `aspectRatio` for sizing, `loading` for lazy loading, and border styling options.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "'none' | 'presentation' | 'img'", + "description": "The accessibility role for the image. Set this to provide semantic meaning for screen readers.", + "defaultValue": "'img'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "alt", + "value": "string", + "description": "Alternative text that describes the image for screen readers. This text should convey the meaning or content of the image to users who can't see it.", + "defaultValue": "`''`" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "aspectRatio", + "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", + "description": "The aspect ratio of the image as a width-to-height ratio (for example, `'16/9'` or `'1'`). This helps prevent layout shifts while the image loads.", + "defaultValue": "'1/1'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Whether to show a border around the image. Set to `true` to display a border, or `false` to hide it.", + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "\"\" | ColorKeyword", + "description": "The color of the border around the image. Choose from `'subdued'`, `'base'`, or `'strong'` to control the visual emphasis.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image. You can use a single value to apply the same radius to all corners, or use the 1-to-4-value syntax to control individual corners.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image. You can use a single value to apply the same style to all sides, or use the 1-to-4-value syntax to control individual sides.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image. You can use a single value to apply the same width to all sides, or use the 1-to-4-value syntax to control individual sides.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "'auto' | 'fill'", + "description": "The inline size (width in horizontal writing modes) of the image. You can use size units like `'100px'` or `'50%'`.", + "defaultValue": "'fill'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "loading", + "value": "'eager' | 'lazy'", + "description": "When the image should be loaded. Use `'lazy'` to defer loading until the image is near the viewport, or `'eager'` to load immediately.", + "defaultValue": "'eager'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "objectFit", + "value": "'contain' | 'cover'", + "description": "How the image should be resized to fit its container. Choose `'cover'` to fill the container while maintaining aspect ratio (cropping if needed), or `'contain'` to fit the entire image within the container.", + "defaultValue": "'contain'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "sizes", + "value": "string", + "description": "The sizes of the image at different viewport widths. Use this with `srcSet` to tell the browser which image to load (for example, `'(max-width: 320px) 280px, 640px'`)." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "src", + "value": "string", + "description": "The URL of the image to display. You can provide an absolute or relative URL pointing to the image file." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "srcSet", + "value": "string", + "description": "A set of source images with different sizes for responsive loading. Use this to provide multiple image sizes for different screen resolutions (for example, `'image-320w.jpg 320w, image-640w.jpg 640w'`)." + } + ], + "value": "export interface ImageProps\n extends Required<\n Pick<\n ImageProps$1,\n | 'alt'\n | 'loading'\n | 'src'\n | 'accessibilityRole'\n | 'inlineSize'\n | 'srcSet'\n | 'sizes'\n | 'aspectRatio'\n | 'objectFit'\n >\n >,\n Required<\n Pick<\n BoxProps,\n | 'border'\n | 'borderColor'\n | 'borderRadius'\n | 'borderStyle'\n | 'borderWidth'\n >\n > {\n /**\n * The URL of the image to display. You can provide an absolute or relative URL pointing to the image file.\n */\n src: ImageProps$1['src'];\n /**\n * A set of source images with different sizes for responsive loading. Use this to provide multiple image sizes for different screen resolutions (for example, `'image-320w.jpg 320w, image-640w.jpg 640w'`).\n */\n srcSet: ImageProps$1['srcSet'];\n /**\n * The sizes of the image at different viewport widths. Use this with `srcSet` to tell the browser which image to load (for example, `'(max-width: 320px) 280px, 640px'`).\n */\n sizes: ImageProps$1['sizes'];\n /**\n * Alternative text that describes the image for screen readers. This text should convey the meaning or content of the image to users who can't see it.\n */\n alt: ImageProps$1['alt'];\n /**\n * The aspect ratio of the image as a width-to-height ratio (for example, `'16/9'` or `'1'`). This helps prevent layout shifts while the image loads.\n */\n aspectRatio: ImageProps$1['aspectRatio'];\n /**\n * How the image should be resized to fit its container. Choose `'cover'` to fill the container while maintaining aspect ratio (cropping if needed), or `'contain'` to fit the entire image within the container.\n */\n objectFit: ImageProps$1['objectFit'];\n /**\n * When the image should be loaded. Use `'lazy'` to defer loading until the image is near the viewport, or `'eager'` to load immediately.\n */\n loading: ImageProps$1['loading'];\n /**\n * The accessibility role for the image. Set this to provide semantic meaning for screen readers.\n */\n accessibilityRole: ImageProps$1['accessibilityRole'];\n /**\n * The inline size (width in horizontal writing modes) of the image. You can use size units like `'100px'` or `'50%'`.\n */\n inlineSize: ImageProps$1['inlineSize'];\n /**\n * Whether to show a border around the image. Set to `true` to display a border, or `false` to hide it.\n */\n border: ImageProps$1['border'];\n /**\n * The width of the border around the image. You can use a single value to apply the same width to all sides, or use the 1-to-4-value syntax to control individual sides.\n */\n borderWidth: ImageProps$1['borderWidth'];\n /**\n * The style of the border around the image. You can use a single value to apply the same style to all sides, or use the 1-to-4-value syntax to control individual sides.\n */\n borderStyle: ImageProps$1['borderStyle'];\n /**\n * The color of the border around the image. Choose from `'subdued'`, `'base'`, or `'strong'` to control the visual emphasis.\n */\n borderColor: ImageProps$1['borderColor'];\n /**\n * The radius of the border corners around the image. You can use a single value to apply the same radius to all corners, or use the 1-to-4-value syntax to control individual corners.\n */\n borderRadius: ImageProps$1['borderRadius'];\n}" + } + }, + "ImageJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ImageJSXProps", + "description": "The properties for the image component when it's used in JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "'none' | 'presentation' | 'img'", + "description": "The accessibility role for the image. Set this to provide semantic meaning for screen readers.", + "defaultValue": "'img'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "alt", + "value": "string", + "description": "Alternative text that describes the image for screen readers. This text should convey the meaning or content of the image to users who can't see it.", + "defaultValue": "`''`" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "aspectRatio", + "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", + "description": "The aspect ratio of the image as a width-to-height ratio (for example, `'16/9'` or `'1'`). This helps prevent layout shifts while the image loads.", + "defaultValue": "'1/1'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Whether to show a border around the image. Set to `true` to display a border, or `false` to hide it.", + "defaultValue": "'none' - equivalent to `none base auto`." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "\"\" | ColorKeyword", + "description": "The color of the border around the image. Choose from `'subdued'`, `'base'`, or `'strong'` to control the visual emphasis.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image. You can use a single value to apply the same radius to all corners, or use the 1-to-4-value syntax to control individual corners.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image. You can use a single value to apply the same style to all sides, or use the 1-to-4-value syntax to control individual sides.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image. You can use a single value to apply the same width to all sides, or use the 1-to-4-value syntax to control individual sides.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "'auto' | 'fill'", + "description": "The inline size (width in horizontal writing modes) of the image. You can use size units like `'100px'` or `'50%'`.", + "defaultValue": "'fill'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "loading", + "value": "'eager' | 'lazy'", + "description": "When the image should be loaded. Use `'lazy'` to defer loading until the image is near the viewport, or `'eager'` to load immediately.", + "defaultValue": "'eager'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "objectFit", + "value": "'contain' | 'cover'", + "description": "How the image should be resized to fit its container. Choose `'cover'` to fill the container while maintaining aspect ratio (cropping if needed), or `'contain'` to fit the entire image within the container.", + "defaultValue": "'contain'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onError", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired when the image fails to load.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onLoad", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired when the image has loaded successfully.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "sizes", + "value": "string", + "description": "The sizes of the image at different viewport widths. Use this with `srcSet` to tell the browser which image to load (for example, `'(max-width: 320px) 280px, 640px'`)." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "src", + "value": "string", + "description": "The URL of the image to display. You can provide an absolute or relative URL pointing to the image file." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "srcSet", + "value": "string", + "description": "A set of source images with different sizes for responsive loading. Use this to provide multiple image sizes for different screen resolutions (for example, `'image-320w.jpg 320w, image-640w.jpg 640w'`)." + } + ], + "value": "export interface ImageJSXProps\n extends Partial,\n Pick {\n /**\n * A callback that's fired when the image fails to load.\n */\n onError?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's fired when the image has loaded successfully.\n */\n onLoad?: ((event: CallbackEvent) => void) | null;\n}" + } + }, + "RequiredLinkProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "RequiredLinkProps", + "value": "Required", + "description": "*", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Link.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "commandFor", + "value": "string", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onBlur", + "value": "(event: FocusEvent) => void", + "description": "Callback when the element loses focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onClick", + "value": "(event: Event) => void", + "description": "Callback when the link is activated. This will be called before navigating to the location specified by `href`.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onFocus", + "value": "(event: FocusEvent) => void", + "description": "Callback when the element receives focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "target", + "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", + "description": "Specifies where to display the linked URL.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "ToneKeyword", + "description": "Sets the tone of the Link, based on the intention of the information being conveyed.", + "isOptional": true, + "defaultValue": "'auto'" + } + ] + } + }, + "LinkProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "LinkProps", + "description": "The properties for the link component. These properties define a clickable link that navigates users to different pages or sections with customizable visual styles and semantic meaning.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "commandFor", + "value": "string", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "target", + "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", + "description": "Specifies where to display the linked URL.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'critical' | 'auto' | 'neutral'", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", + "defaultValue": "'auto'" + } + ], + "value": "export interface LinkProps extends LinkBaseProps {\n /**\n * The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n * - `'auto'` - The system automatically chooses the appropriate tone based on context.\n * - `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n * - `'critical'` - Red styling for links that lead to destructive actions or important warnings.\n *\n * @default 'auto'\n */\n tone: Extract;\n}" + } + }, + "LinkJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "LinkJSXProps", + "description": "The JSX properties for the link component. These properties define how a link is rendered in Preact or JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The text or content to display inside the link. This typically describes the destination or action the link performs.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "commandFor", + "value": "string", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onClick", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback function that's invoked when the link is clicked. It receives the click event as an argument.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "target", + "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", + "description": "Specifies where to display the linked URL.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'critical' | 'auto' | 'neutral'", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", + "defaultValue": "'auto'" + } + ], + "value": "export interface LinkJSXProps\n extends Partial,\n Pick {\n /**\n * The text or content to display inside the link. This typically describes the destination or action the link performs.\n */\n children?: ComponentChildren;\n /**\n * A callback function that's invoked when the link is clicked. It receives the click event as an argument.\n */\n onClick?: ((event: CallbackEvent) => void) | null;\n}" + } + }, + "ListItemProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ListItemProps", + "description": "The properties that you can set on a list item component.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the ListItem.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface ListItemProps extends ListItemProps$1 {}" + } + }, + "ListItemJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ListItemJSXProps", + "description": "The JSX properties you can set on a list item component.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content to display inside the list item.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface ListItemJSXProps\n extends Partial,\n Pick {\n /**\n * The content to display inside the list item.\n */\n children?: ComponentChildren;\n}" + } + }, + "MenuProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "MenuProps", + "description": "The properties you can set on a menu component.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced using assistive technologies and provide additional context.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface MenuProps\n extends Required> {}" + } + }, + "MenuJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "MenuJSXProps", + "description": "The JSX properties you can set on a menu component.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced using assistive technologies and provide additional context.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The menu items to display, which should include button and section components.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface MenuJSXProps\n extends Partial,\n Pick {\n /**\n * The menu items to display, which should include button and section components.\n */\n children?: ComponentChildren;\n}" + } + }, + "RequiredAlignedModalProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "RequiredAlignedModalProps", + "value": "Required", + "description": "*", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose of the modal. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nThis overrides the `heading` prop for screen readers.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Modal.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "heading", + "value": "string", + "description": "A title that describes the content of the Modal.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "hideOverlay", + "value": "() => void", + "description": "Method to hide an overlay." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onAfterHide", + "value": "(event: Event) => void", + "description": "Callback fired when the overlay is hidden **after** any animations to hide the overlay have finished.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onAfterShow", + "value": "(event: Event) => void", + "description": "Callback fired when the overlay is shown **after** any animations to show the overlay have finished.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onHide", + "value": "(event: Event) => void", + "description": "Callback fired after the overlay is hidden.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onShow", + "value": "(event: Event) => void", + "description": "Callback fired after the overlay is shown.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "'base' | 'none'", + "description": "Adjust the padding around the Modal content.\n\n`base`: applies padding that is appropriate for the element.\n\n`none`: removes all padding from the element. This can be useful when elements inside the Modal need to span to the edge of the Modal. For example, a full-width image. In this case, rely on `Box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "isOptional": true, + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "primaryAction", + "value": "ComponentChildren", + "description": "The primary action to perform, provided as a button or link type element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "secondaryActions", + "value": "ComponentChildren", + "description": "The secondary actions to perform, provided as button or link type elements.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "showOverlay", + "value": "() => void", + "description": "Method to show an overlay." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "size", + "value": "SizeKeyword | 'max'", + "description": "Adjust the size of the Modal.\n\n`max`: expands the Modal to its maximum size as defined by the host application, on both the horizontal and vertical axes.", + "isOptional": true, + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "toggleOverlay", + "value": "() => void", + "description": "Method to toggle the visiblity of an overlay." + } + ] + } + }, + "RequiredMoneyFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "RequiredMoneyFieldProps", + "value": "Required", + "description": "The required properties from the `MoneyFieldProps$1` definition. This type ensures all properties from the shared definition are marked as required.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "autocomplete", + "value": "| AutocompleteField\n | `${AutocompleteSection} ${AutocompleteField}`\n | `${AutocompleteGroup} ${AutocompleteField}`\n | `${AutocompleteSection} ${AutocompleteGroup} ${AutocompleteField}`\n | 'on'\n | 'off'", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "isOptional": true, + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "controls", + "value": "'auto' | 'stepper' | 'none'", + "description": "Sets the type of controls displayed in the field.\n\n- `stepper`: displays buttons to increase or decrease the value of the field by the stepping interval defined in the `step` property. Appropriate mouse and [keyboard interactions](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/spinbutton_role#keyboard_interactions) to control the value of the field are enabled.\n- `none`: no controls are displayed and users must input the value manually. Arrow keys and scroll wheels can’t be used either to avoid accidental changes.\n- `auto`: the presence of the controls depends on the surface and context.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "currencyCode", + "value": "CurrencyCode | 'auto'", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "max", + "value": "number", + "description": "The highest decimal or integer to be accepted for the field. When used with `step` the value will round down to the max number.\n\nNote: a user will still be able to use the keyboard to input a number higher than the max. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "min", + "value": "number", + "description": "The lowest decimal or integer to be accepted for the field. When used with `step` the value will round up to the min number.\n\nNote: a user will still be able to use the keyboard to input a number lower than the min. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "-Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onBlur", + "value": "(event: FocusEvent) => void", + "description": "Callback when the element loses focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onChange", + "value": "(event: Event) => void", + "description": "Callback when the user has **finished editing** a field, e.g. once they have blurred the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onFocus", + "value": "(event: FocusEvent) => void", + "description": "Callback when the element receives focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onInput", + "value": "(event: Event) => void", + "description": "Callback when the user makes any changes in the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "step", + "value": "number", + "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "isOptional": true, + "defaultValue": "1" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", + "isOptional": true + } + ] + } + }, + "AutocompleteSection": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "AutocompleteSection", + "value": "`section-${string}`", + "description": "The “section” scopes the autocomplete data that should be inserted to a specific area of the page.\n\nCommonly used when there are multiple fields with the same autocomplete needs in the same page. For example: 2 shipping address forms in the same page." + } + }, + "AutocompleteGroup": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "AutocompleteGroup", + "value": "'shipping' | 'billing'", + "description": "The contact information group the autocomplete data should be sourced from." + } + }, + "MoneyFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "MoneyFieldProps", + "description": "The properties for the money field component. These properties configure a specialized input field for entering monetary amounts with automatic currency formatting, decimal handling, and range validation.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "currencyCode", + "value": "CurrencyCode | 'auto'", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "max", + "value": "number", + "description": "The highest decimal or integer to be accepted for the field. When used with `step` the value will round down to the max number.\n\nNote: a user will still be able to use the keyboard to input a number higher than the max. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "min", + "value": "number", + "description": "The lowest decimal or integer to be accepted for the field. When used with `step` the value will round up to the min number.\n\nNote: a user will still be able to use the keyboard to input a number lower than the min. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "-Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current monetary value for the field, represented as a string." + } + ], + "value": "export interface MoneyFieldProps\n extends Omit,\n Pick {\n /**\n * The current monetary value for the field, represented as a string.\n */\n value: Required['value'];\n}" + } + }, + "MoneyFieldJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "MoneyFieldJSXProps", + "description": "The JSX props for the money field component. These properties extend `MoneyFieldProps` with JSX-specific event callbacks for React-style event handling when used in Preact.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "currencyCode", + "value": "CurrencyCode | 'auto'", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "max", + "value": "number", + "description": "The highest decimal or integer to be accepted for the field. When used with `step` the value will round down to the max number.\n\nNote: a user will still be able to use the keyboard to input a number higher than the max. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "min", + "value": "number", + "description": "The lowest decimal or integer to be accepted for the field. When used with `step` the value will round up to the min number.\n\nNote: a user will still be able to use the keyboard to input a number lower than the min. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "-Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user has finished editing the field, such as when they blur the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user makes changes to the field value. This fires before `onChange`.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current monetary value for the field, represented as a string." + } + ], + "value": "export interface MoneyFieldJSXProps\n extends Partial>,\n FieldReactProps,\n Pick,\n FieldSlotInternalReactProps {}" + } + }, + "NumberFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "NumberFieldProps", + "description": "The properties for the number field component. These properties configure a specialized input field for entering numeric values with support for validation, formatting, range constraints, and optimized mobile input modes.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inputMode", + "value": "'decimal' | 'numeric'", + "description": "Sets the virtual keyboard.", + "isOptional": true, + "defaultValue": "'decimal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "max", + "value": "number", + "description": "The highest decimal or integer to be accepted for the field. When used with `step` the value will round down to the max number.\n\nNote: a user will still be able to use the keyboard to input a number higher than the max. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "min", + "value": "number", + "description": "The lowest decimal or integer to be accepted for the field. When used with `step` the value will round up to the min number.\n\nNote: a user will still be able to use the keyboard to input a number lower than the min. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "-Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "prefix", + "value": "string", + "description": "A value to be displayed immediately before the editable portion of the field.\n\nThis is useful for displaying an implied part of the value, such as \"https://\" or \"+353\".\n\nThis cannot be edited by the user, and it isn't included in the value of the field.\n\nIt may not be displayed until the user has interacted with the input. For example, an inline label may take the place of the prefix until the user focuses the input.", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "step", + "value": "number", + "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "isOptional": true, + "defaultValue": "1" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "suffix", + "value": "string", + "description": "A value to be displayed immediately after the editable portion of the field.\n\nThis is useful for displaying an implied part of the value, such as \"@shopify.com\", or \"%\".\n\nThis cannot be edited by the user, and it isn't included in the value of the field.\n\nIt may not be displayed until the user has interacted with the input. For example, an inline label may take the place of the suffix until the user focuses the input.", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current value for the field, represented as a string." + } + ], + "value": "export interface NumberFieldProps\n extends Omit<\n PreactFieldProps['autocomplete']>,\n 'value'\n >,\n Required<\n Pick<\n NumberFieldProps$1,\n 'inputMode' | 'max' | 'min' | 'prefix' | 'step' | 'suffix'\n >\n > {\n /**\n * The current value for the field, represented as a string.\n */\n value: Required['value'];\n}" + } + }, + "NumberFieldJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "NumberFieldJSXProps", + "description": "The JSX props for the number field component. These properties extend `NumberFieldProps` with JSX-specific event callbacks for React-style event handling when used in Preact.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inputMode", + "value": "'decimal' | 'numeric'", + "description": "Sets the virtual keyboard.", + "isOptional": true, + "defaultValue": "'decimal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "max", + "value": "number", + "description": "The highest decimal or integer to be accepted for the field. When used with `step` the value will round down to the max number.\n\nNote: a user will still be able to use the keyboard to input a number higher than the max. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "min", + "value": "number", + "description": "The lowest decimal or integer to be accepted for the field. When used with `step` the value will round up to the min number.\n\nNote: a user will still be able to use the keyboard to input a number lower than the min. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "-Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user has finished editing the field, such as when they blur the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user makes changes to the field value. This fires before `onChange`.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "prefix", + "value": "string", + "description": "A value to be displayed immediately before the editable portion of the field.\n\nThis is useful for displaying an implied part of the value, such as \"https://\" or \"+353\".\n\nThis cannot be edited by the user, and it isn't included in the value of the field.\n\nIt may not be displayed until the user has interacted with the input. For example, an inline label may take the place of the prefix until the user focuses the input.", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "step", + "value": "number", + "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "isOptional": true, + "defaultValue": "1" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "suffix", + "value": "string", + "description": "A value to be displayed immediately after the editable portion of the field.\n\nThis is useful for displaying an implied part of the value, such as \"@shopify.com\", or \"%\".\n\nThis cannot be edited by the user, and it isn't included in the value of the field.\n\nIt may not be displayed until the user has interacted with the input. For example, an inline label may take the place of the suffix until the user focuses the input.", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current value for the field, represented as a string." + } + ], + "value": "export interface NumberFieldJSXProps\n extends Partial>,\n Pick,\n FieldReactProps,\n FieldSlotInternalReactProps {}" + } + }, + "OptionProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "OptionProps", + "description": "Properties for rendering a single option within a select dropdown that users can choose from.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultSelected", + "value": "boolean", + "description": "Whether the control is active by default.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the control, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "selected", + "value": "boolean", + "description": "Whether the control is active.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The value used in form data when the control is checked.", + "isOptional": true + } + ], + "value": "export interface OptionProps\n extends Required<\n Pick\n > {}" + } + }, + "OptionJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "OptionJSXProps", + "description": "Properties for using the option component in JSX with React-style props.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content that's used as the option label, displayed in the dropdown list.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultSelected", + "value": "boolean", + "description": "Whether the control is active by default.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the control, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "selected", + "value": "boolean", + "description": "Whether the control is active.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The value used in form data when the control is checked.", + "isOptional": true + } + ], + "value": "export interface OptionJSXProps\n extends Partial,\n Pick {\n /**\n * The content that's used as the option label, displayed in the dropdown list.\n */\n children?: ComponentChildren;\n}" + } + }, + "OptionGroupProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "OptionGroupProps", + "description": "Properties for rendering a group of related options within a select dropdown, organized under a shared label.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Whether the options within this group can be selected or not.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string", + "description": "The user-facing label for this group of options.", + "isOptional": true + } + ], + "value": "export interface OptionGroupProps\n extends Required> {}" + } + }, + "OptionGroupJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "OptionGroupJSXProps", + "description": "Properties for using the option group component in JSX with React-style props.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The selectable options displayed in the dropdown list. Accepts option components for individual selectable items within this group.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Whether the options within this group can be selected or not.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string", + "description": "The user-facing label for this group of options.", + "isOptional": true + } + ], + "value": "export interface OptionGroupJSXProps\n extends Partial,\n Pick {\n /**\n * The selectable options displayed in the dropdown list. Accepts option components for individual selectable items within this group.\n */\n children?: ComponentChildren;\n}" + } + }, + "OrderedListProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "OrderedListProps", + "description": "The properties for the ordered list component. These properties define a numbered list of items with automatic numbering and proper list semantics.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the OrderededList.\n\nAccepts only `ListItem` components.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface OrderedListProps extends OrderedListProps$1 {}" + } + }, + "OrderedListJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "OrderedListJSXProps", + "description": "The JSX properties for the ordered list component. These properties define how an ordered list is rendered in Preact or JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The items in the ordered list. Only list item components are accepted.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface OrderedListJSXProps\n extends Partial,\n Pick {\n /**\n * The items in the ordered list. Only list item components are accepted.\n */\n children?: ComponentChildren;\n}" + } + }, + "ParagraphProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ParagraphProps", + "description": "The properties for the paragraph component. These properties define blocks of text content with consistent spacing and styling for readable body copy.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "color", + "value": "'base' | 'subdued'", + "description": "The color of the paragraph text. Available options:\n- `'base'` - The default text color.\n- `'subdued'` - A lighter text color for secondary information.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "dir", + "value": "'ltr' | 'rtl' | 'auto' | ''", + "description": "Indicates the directionality of the element’s text.\n\n- `ltr`: languages written from left to right (e.g. English)\n- `rtl`: languages written from right to left (e.g. Arabic)\n- `auto`: the user agent determines the direction based on the content\n- `''`: direction is inherited from parent elements (equivalent to not setting the attribute)", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "fontVariantNumeric", + "value": "'auto' | 'normal' | 'tabular-nums'", + "description": "Set the numeric properties of the font.", + "isOptional": true, + "defaultValue": "'auto' - inherit from the parent element" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "lineClamp", + "value": "number", + "description": "Truncates the text content to the specified number of lines.", + "isOptional": true, + "defaultValue": "Infinity - no truncation is applied" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto' | 'neutral' | 'caution'", + "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", + "defaultValue": "'auto'" + } + ], + "value": "export interface ParagraphProps\n extends Required<\n Pick<\n ParagraphProps$1,\n | 'accessibilityVisibility'\n | 'fontVariantNumeric'\n | 'tone'\n | 'dir'\n | 'color'\n | 'lineClamp'\n >\n > {\n /**\n * The color of the paragraph text. Available options:\n * - `'base'` - The default text color.\n * - `'subdued'` - A lighter text color for secondary information.\n */\n color: Extract;\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: Extract<\n ParagraphProps$1['tone'],\n 'auto' | 'neutral' | 'info' | 'success' | 'caution' | 'warning' | 'critical'\n >;\n}" + } + }, + "ParagraphJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ParagraphJSXProps", + "description": "The JSX properties for the paragraph component. These properties define how a paragraph is rendered in Preact or JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the paragraph.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "color", + "value": "'base' | 'subdued'", + "description": "The color of the paragraph text. Available options:\n- `'base'` - The default text color.\n- `'subdued'` - A lighter text color for secondary information.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "dir", + "value": "'ltr' | 'rtl' | 'auto' | ''", + "description": "Indicates the directionality of the element’s text.\n\n- `ltr`: languages written from left to right (e.g. English)\n- `rtl`: languages written from right to left (e.g. Arabic)\n- `auto`: the user agent determines the direction based on the content\n- `''`: direction is inherited from parent elements (equivalent to not setting the attribute)", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "fontVariantNumeric", + "value": "'auto' | 'normal' | 'tabular-nums'", + "description": "Set the numeric properties of the font.", + "isOptional": true, + "defaultValue": "'auto' - inherit from the parent element" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "lineClamp", + "value": "number", + "description": "Truncates the text content to the specified number of lines.", + "isOptional": true, + "defaultValue": "Infinity - no truncation is applied" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto' | 'neutral' | 'caution'", + "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", + "defaultValue": "'auto'" + } + ], + "value": "export interface ParagraphJSXProps\n extends Partial,\n Pick {\n /**\n * The content of the paragraph.\n */\n children?: ComponentChildren;\n}" + } + }, + "PasswordFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "PasswordFieldProps", + "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required<\n Pick<\n PasswordFieldProps$1,\n | 'defaultValue'\n | 'details'\n | 'disabled'\n | 'error'\n | 'labelAccessibilityVisibility'\n | 'minLength'\n | 'maxLength'\n | 'label'\n | 'name'\n | 'placeholder'\n | 'readOnly'\n | 'required'\n | 'value'\n >\n >", + "description": "The properties for the password field component. These properties configure a secure input field that collects sensitive password input from merchants with masked characters.", + "isPublicDocs": true + } + }, + "PasswordFieldJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "PasswordFieldJSXProps", + "description": "The JSX props for the password field component. These properties extend `PasswordFieldProps` with JSX-specific event callbacks for React-style event handling when used in Preact.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxLength", + "value": "number", + "description": "Specifies the maximum number of characters allowed.", + "isOptional": true, + "defaultValue": "Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minLength", + "value": "number", + "description": "Specifies the min number of characters allowed.", + "isOptional": true, + "defaultValue": "0" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user has finished editing the field, such as when they blur the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user makes changes to the field value. This fires before `onChange`.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", + "isOptional": true + } + ], + "value": "export interface PasswordFieldJSXProps\n extends Partial>,\n Pick,\n FieldReactProps,\n FieldSlotInternalReactProps {}" + } + }, + "QueryContainerProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "QueryContainerProps", + "description": "The properties you can set on a query container component.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "containerName", + "value": "string", + "description": "The name of the container, which can be used in your container queries to target this container specifically.\n\nWe place the container name of `s-default` on every container. Because of this, it is not required to add a `containerName` identifier in your queries. For example, a `@container (inline-size <= 300px) none, auto` query is equivalent to `@container s-default (inline-size <= 300px) none, auto`.\n\nAny value set in `containerName` will be set alongside alongside `s-default`. For example, `containerName=\"my-container-name\"` will result in a value of `s-default my-container-name` set on the `container-name` CSS property of the rendered HTML.", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface QueryContainerProps\n extends Required> {}" + } + }, + "QueryContainerJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "QueryContainerJSXProps", + "description": "The JSX properties you can set on a query container component.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content to display inside the container.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "containerName", + "value": "string", + "description": "The name of the container, which can be used in your container queries to target this container specifically.\n\nWe place the container name of `s-default` on every container. Because of this, it is not required to add a `containerName` identifier in your queries. For example, a `@container (inline-size <= 300px) none, auto` query is equivalent to `@container s-default (inline-size <= 300px) none, auto`.\n\nAny value set in `containerName` will be set alongside alongside `s-default`. For example, `containerName=\"my-container-name\"` will result in a value of `s-default my-container-name` set on the `container-name` CSS property of the rendered HTML.", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface QueryContainerJSXProps\n extends Partial,\n Pick {\n /**\n * The content to display inside the container.\n */\n children?: ComponentChildren;\n}" + } + }, + "SearchFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "SearchFieldProps", + "value": "PreactFieldProps<\n /**\n * @default 'on'\n */\n Required['autocomplete']\n> & Required<\n Pick<\n TextFieldProps$1,\n | 'defaultValue'\n | 'details'\n | 'disabled'\n | 'error'\n | 'labelAccessibilityVisibility'\n | 'minLength'\n | 'maxLength'\n | 'label'\n | 'name'\n | 'placeholder'\n | 'readOnly'\n | 'required'\n | 'value'\n >\n >", + "description": "Properties for rendering a search field that lets users enter search queries with validation constraints and autofill support.", + "isPublicDocs": true + } + }, + "SearchFieldJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SearchFieldJSXProps", + "description": "Props for using the search field component in JSX with React-style event handlers.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxLength", + "value": "number", + "description": "Specifies the maximum number of characters allowed.", + "isOptional": true, + "defaultValue": "Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minLength", + "value": "number", + "description": "Specifies the min number of characters allowed.", + "isOptional": true, + "defaultValue": "0" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user has finished editing the field, such as when they blur the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user makes changes to the field value. This fires before `onChange`.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", + "isOptional": true + } + ], + "value": "export interface SearchFieldJSXProps\n extends Partial>,\n Pick,\n FieldReactProps,\n FieldSlotInternalReactProps {}" + } + }, + "RequiredSectionProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "RequiredSectionProps", + "value": "Required", + "description": "A version of the section properties with all fields required.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label used to describe the section that will be announced by assistive technologies.\n\nWhen no `heading` property is provided or included as a children of the Section, you **must** provide an `accessibilityLabel` to describe the Section. This is important as it allows assistive technologies to provide the right context to users.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Section.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "heading", + "value": "string", + "description": "A title that describes the content of the section.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "'base' | 'none'", + "description": "Adjust the padding of all edges.\n\n- `base`: applies padding that is appropriate for the element. Note that it may result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the Section need to span to the edge of the Section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "isOptional": true, + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "primaryAction", + "value": "ComponentChildren", + "description": "The primary action to perform, provided as a button or link type element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "secondaryActions", + "value": "ComponentChildren", + "description": "The secondary actions to perform, provided as button or link type elements.", + "isOptional": true + } + ] + } + }, + "SectionProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SectionProps", + "description": "The properties for the section component. A section groups related content together with an optional heading, providing semantic structure and visual separation.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "An accessibility label for screen readers that provides additional context when the heading isn't descriptive enough on its own." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "heading", + "value": "string", + "description": "The heading text that appears at the top of the section, helping users understand what content the section contains." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "'base' | 'none'", + "description": "Whether the section has padding around its content. Set to `true` to add padding, or `false` to remove it.", + "defaultValue": "'base'" + } + ], + "value": "export interface SectionProps\n extends Pick<\n RequiredSectionProps,\n 'accessibilityLabel' | 'heading' | 'padding'\n > {\n /**\n * An accessibility label for screen readers that provides additional context when the heading isn't descriptive enough on its own.\n */\n accessibilityLabel: RequiredSectionProps['accessibilityLabel'];\n /**\n * The heading text that appears at the top of the section, helping users understand what content the section contains.\n */\n heading: RequiredSectionProps['heading'];\n /**\n * Whether the section has padding around its content. Set to `true` to add padding, or `false` to remove it.\n */\n padding: RequiredSectionProps['padding'];\n}" + } + }, + "SectionJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SectionJSXProps", + "description": "The properties for the section component when it's used in JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "An accessibility label for screen readers that provides additional context when the heading isn't descriptive enough on its own." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The child elements to render inside the section.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "heading", + "value": "string", + "description": "The heading text that appears at the top of the section, helping users understand what content the section contains." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "'base' | 'none'", + "description": "Whether the section has padding around its content. Set to `true` to add padding, or `false` to remove it.", + "defaultValue": "'base'" + } + ], + "value": "export interface SectionJSXProps\n extends Partial,\n Pick {\n /**\n * The child elements to render inside the section.\n */\n children?: ComponentChildren;\n}" + } + }, + "SelectProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SelectProps", + "description": "Properties for rendering a select dropdown that lets users choose one option from a list with optional icon and label customization.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "icon", + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field to provide visual context for the selection.", + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The value of the currently selected option, matching one of the `value` properties from the available options." + } + ], + "value": "export interface SelectProps\n extends Omit,\n Required<\n Pick<\n SelectProps$1,\n | 'details'\n | 'disabled'\n | 'error'\n | 'label'\n | 'name'\n | 'placeholder'\n | 'required'\n | 'icon'\n | 'labelAccessibilityVisibility'\n >\n > {\n /**\n * The value of the currently selected option, matching one of the `value` properties from the available options.\n */\n value: Required['value'];\n /**\n * An icon that's displayed at the start of the select field to provide visual context for the selection.\n */\n icon: IconProps['type'];\n}" + } + }, + "SelectJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SelectJSXProps", + "description": "Properties for using the select component in JSX with React-style event handlers.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The selectable options displayed in the dropdown list.\n\nAccepts option components for individual selectable items, and option group components to organize related options into logical groups with labels.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "icon", + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field to provide visual context for the selection." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onBlur", + "value": "(event: CallbackEvent<\"s-select\">) => void", + "description": "A callback that's triggered when the select loses focus after the user interacts with it.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onChange", + "value": "(event: CallbackEvent<\"s-select\">) => void", + "description": "A callback that's triggered when the selected option changes and the select loses focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onFocus", + "value": "(event: CallbackEvent<\"s-select\">) => void", + "description": "A callback that's triggered when the select receives focus from the user.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onInput", + "value": "(event: CallbackEvent<\"s-select\">) => void", + "description": "A callback that's triggered when the selected option changes as the user interacts with the dropdown.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The value of the currently selected option, matching one of the `value` properties from the available options." + } + ], + "value": "export interface SelectJSXProps\n extends Partial>,\n Pick,\n FieldSlotInternalReactProps {\n /**\n * The selectable options displayed in the dropdown list.\n *\n * Accepts option components for individual selectable items, and option group components to organize related options into logical groups with labels.\n */\n children?: ComponentChildren;\n /**\n * A callback that's triggered when the selected option changes and the select loses focus.\n */\n onChange?: (event: CallbackEvent) => void;\n /**\n * A callback that's triggered when the selected option changes as the user interacts with the dropdown.\n */\n onInput?: (event: CallbackEvent) => void;\n /**\n * A callback that's triggered when the select loses focus after the user interacts with it.\n */\n onBlur?: (event: CallbackEvent) => void;\n /**\n * A callback that's triggered when the select receives focus from the user.\n */\n onFocus?: (event: CallbackEvent) => void;\n}" + } + }, + "SpinnerProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SpinnerProps", + "description": "The properties you can set on a spinner component.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose of the progress. When set, it will be announced to users using assistive technologies and will provide them with more context. Providing an `accessibilityLabel` is recommended if there is no accompanying text describing that something is loading.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "size", + "value": "'base' | 'large' | 'large-100'", + "description": "The size of the spinner. Use `base` for the standard size, `large` for a larger spinner, or `large-100` for a full-width large spinner.", + "defaultValue": "'base'" + } + ], + "value": "export interface SpinnerProps\n extends Required> {\n /**\n * The size of the spinner. Use `base` for the standard size, `large` for a larger spinner, or `large-100` for a full-width large spinner.\n */\n size: Extract;\n}" + } + }, + "SpinnerJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SpinnerJSXProps", + "description": "The JSX properties you can set on a spinner component.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose of the progress. When set, it will be announced to users using assistive technologies and will provide them with more context. Providing an `accessibilityLabel` is recommended if there is no accompanying text describing that something is loading.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "size", + "value": "'base' | 'large' | 'large-100'", + "description": "The size of the spinner. Use `base` for the standard size, `large` for a larger spinner, or `large-100` for a full-width large spinner.", + "defaultValue": "'base'" + } + ], + "value": "export interface SpinnerJSXProps\n extends Partial,\n Pick {}" + } + }, + "AlignedStackProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "AlignedStackProps", + "value": "Required", + "description": "A version of the stack properties with all fields required.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "alignContent", + "value": "MaybeResponsive", + "description": "Aligns the Stack along the cross axis.", + "isOptional": true, + "defaultValue": "'normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "alignItems", + "value": "MaybeResponsive", + "description": "Aligns the Stack's children along the cross axis.", + "isOptional": true, + "defaultValue": "'normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "background", + "value": "BackgroundColorKeyword", + "description": "Adjust the background of the element.", + "isOptional": true, + "defaultValue": "'transparent'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "MaybeResponsive", + "description": "Adjust the block size.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "ColorKeyword | ''", + "description": "Set the color of the border.\n\nIf set, it takes precedence over the `border` property's color.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Set the radius of the border.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `start-start start-end end-end end-start`\n- 3 values: `start-start (start-end & end-start) start-end`\n- 2 values: `(start-start & end-end) (start-end & end-start)`\n\nFor example:\n- `small-100` means start-start, start-end, end-end and end-start border radii are `small-100`.\n- `small-100 none` means start-start and end-end border radii are `small-100`, start-end and end-start border radii are `none`.\n- `small-100 none large-100` means start-start border radius is `small-100`, start-end border radius is `none`, end-end border radius is `large-100` and end-start border radius is `none`.\n- `small-100 none large-100 small-100` means start-start border radius is `small-100`, start-end border radius is `none`, end-end border radius is `large-100` and end-start border radius is `small-100`.", + "isOptional": true, + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "MaybeAllValuesShorthandProperty | ''", + "description": "Set the style of the border.\n\nIf set, it takes precedence over the `border` property's style.\n\nLike CSS, up to 4 values can be specified.\n\nIf one value is specified, it applies to all sides.\n\nIf two values are specified, they apply to the block sides and inline sides respectively.\n\nIf three values are specified, they apply to the block-start, both inline sides, and block-end respectively.\n\nIf four values are specified, they apply to the block-start, block-end, inline-start, and inline-end sides respectively.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "MaybeAllValuesShorthandProperty | ''", + "description": "Set the width of the border.\n\nIf set, it takes precedence over the `border` property's width.\n\nLike CSS, up to 4 values can be specified.\n\nIf one value is specified, it applies to all sides.\n\nIf two values are specified, they apply to the block sides and inline sides respectively.\n\nIf three values are specified, they apply to the block-start, both inline sides, and block-end respectively.\n\nIf four values are specified, they apply to the block-start, block-end, inline-start, and inline-end sides respectively.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Stack.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "columnGap", + "value": "MaybeResponsive", + "description": "Adjust spacing between elements in the inline axis.\n\nThis overrides the column value of `gap`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "direction", + "value": "MaybeResponsive<'block' | 'inline'>", + "description": "Sets how the children are placed within the Stack. This uses [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).", + "isOptional": true, + "defaultValue": "'block'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "display", + "value": "MaybeResponsive<'auto' | 'none'>", + "description": "Sets the outer display type of the component. The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gap", + "value": "MaybeResponsive>", + "description": "Adjust spacing between elements.\n\nA single value applies to both axes. A pair of values (eg `large-100 large-500`) can be used to set the inline and block axes respectively.", + "isOptional": true, + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "MaybeResponsive", + "description": "Adjust the inline size.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "justifyContent", + "value": "MaybeResponsive", + "description": "Aligns the Stack along the main axis.", + "isOptional": true, + "defaultValue": "'normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "MaybeResponsive", + "description": "Adjust the maximum block size.", + "isOptional": true, + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "MaybeResponsive", + "description": "Adjust the maximum inline size.", + "isOptional": true, + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "MaybeResponsive", + "description": "Adjust the minimum block size.", + "isOptional": true, + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "MaybeResponsive", + "description": "Adjust the minimum inline size.", + "isOptional": true, + "defaultValue": "'0'" + }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@shadowDomRerenderObserver@2661", - "value": "MutationObserver", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@onEscape@2655", - "value": "(event: KeyboardEvent) => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "MaybeResponsive>", + "description": "Adjust the padding of all edges.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `block-start inline-end block-end inline-start`\n- 3 values: `block-start inline block-end`\n- 2 values: `block inline`\n\nFor example:\n- `large` means block-start, inline-end, block-end and inline-start paddings are `large`.\n- `large none` means block-start and block-end paddings are `large`, inline-start and inline-end paddings are `none`.\n- `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`.\n- `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`.\n\nA padding value of `auto` will use the default padding for the closest container that has had its usual padding removed.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@onBackdropClick@2657", - "value": "(event: MouseEvent) => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "paddingBlock", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the block-padding.\n\n- `large none` means block-start padding is `large`, block-end padding is `none`.\n\nThis overrides the block value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@onChildModalChange@2659", - "value": "EventListenerOrEventListenerObject", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "paddingBlockEnd", + "value": "MaybeResponsive", + "description": "Adjust the block-end padding.\n\nThis overrides the block-end value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "__@isOpen@2651", - "value": "boolean", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "paddingBlockStart", + "value": "MaybeResponsive", + "description": "Adjust the block-start padding.\n\nThis overrides the block-start value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "__@dismiss@2653", - "value": "() => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "paddingInline", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the inline padding.\n\n- `large none` means inline-start padding is `large`, inline-end padding is `none`.\n\nThis overrides the inline value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "__@hasOpenChildModal@2648", - "value": "boolean", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "paddingInlineEnd", + "value": "MaybeResponsive", + "description": "Adjust the inline-end padding.\n\nThis overrides the inline-end value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "__@show@2649", - "value": "() => Promise", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "paddingInlineStart", + "value": "MaybeResponsive", + "description": "Adjust the inline-start padding.\n\nThis overrides the inline-start value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "__@hide@2650", - "value": "() => Promise", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "rowGap", + "value": "MaybeResponsive", + "description": "Adjust spacing between elements in the block axis.\n\nThis overrides the row value of `gap`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + } + ] + } + }, + "ResponsiveStackProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "ResponsiveStackProps", + "value": "MakeResponsivePick<\n AlignedStackProps,\n 'gap' | 'rowGap' | 'columnGap' | 'direction'\n>", + "description": "The stack properties that support responsive values through container queries.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "columnGap", + "value": "MaybeResponsive", + "description": "Adjust spacing between elements in the inline axis.\n\nThis overrides the column value of `gap`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@2598", - "value": "boolean", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "direction", + "value": "MaybeResponsive<'block' | 'inline'>", + "description": "Sets how the children are placed within the Stack. This uses [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).", + "isOptional": true, + "defaultValue": "'block'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@2599", - "value": "HTMLElement", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "gap", + "value": "MaybeResponsive>", + "description": "Adjust spacing between elements.\n\nA single value applies to both axes. A pair of values (eg `large-100 large-500`) can be used to set the inline and block axes respectively.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@2600", - "value": "number", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "rowGap", + "value": "MaybeResponsive", + "description": "Adjust spacing between elements in the block axis.\n\nThis overrides the row value of `gap`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + } + ] + } + }, + "StackProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "StackProps", + "description": "The properties for the stack component. A stack arranges its children in a single direction with controlled spacing and alignment along both axes.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "alignContent", + "value": "AlignContentKeyword", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "defaultValue": "'normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "alignItems", + "value": "AlignItemsKeyword", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "defaultValue": "'normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "background", + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", + "defaultValue": "'transparent'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "columnGap", + "value": "MaybeResponsive<\"\" | SpacingKeyword>", + "description": "The spacing between children in the inline axis (horizontal in left-to-right languages). This property overrides the column spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "direction", + "value": "MaybeResponsive<\"inline\" | \"block\">", + "description": "The direction in which the stack's children are laid out. Use `'inline'` to arrange children horizontally (with wrapping enabled), or `'block'` to arrange them vertically (without wrapping). This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'block'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "display", + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gap", + "value": "MaybeResponsive>", + "description": "The spacing between children in the stack. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value to apply the same spacing to both axes (for example, `'large-100'`), or a pair of values (for example, `'large-100 large-500'`) to set different spacing for the block and inline axes. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "justifyContent", + "value": "JustifyContentKeyword", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "defaultValue": "'normal'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - } - ], - "value": "declare class Modal extends PreactOverlayElement implements ModalProps {\n accessor accessibilityLabel: ModalProps['accessibilityLabel'];\n accessor heading: ModalProps['heading'];\n accessor padding: ModalProps['padding'];\n accessor size: ModalProps['size'];\n /** @private */\n [abortController]: AbortController;\n /** @private */\n [dialog]: HTMLDialogElement | null;\n /** @private */\n [focusedElement]: HTMLElement | null;\n /** @private */\n [nestedModals]: Map;\n /** @private */\n [childrenRerenderObserver]: MutationObserver;\n /** @private */\n [shadowDomRerenderObserver]: MutationObserver;\n /** @private */\n [onEscape]: (event: KeyboardEvent) => void;\n /** @private */\n [onBackdropClick]: (event: MouseEvent) => void;\n /** @private */\n [onChildModalChange]: EventListenerOrEventListenerObject;\n /** @private */\n get [isOpen](): boolean;\n /** @private */\n [dismiss](): void;\n /** @private */\n get [hasOpenChildModal](): boolean;\n /** @private */\n [show](): Promise;\n /** @private */\n [hide](): Promise;\n showOverlay(): void;\n hideOverlay(): void;\n toggleOverlay(): void;\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n constructor();\n}" - } - }, - "RequiredMoneyFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RequiredMoneyFieldProps", - "value": "Required", - "description": "Represents the money field component props with all properties marked as required.", - "isPublicDocs": true, - "members": [ + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", + "defaultValue": "'none'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "autocomplete", - "value": "| AutocompleteField\n | `${AutocompleteSection} ${AutocompleteField}`\n | `${AutocompleteGroup} ${AutocompleteField}`\n | `${AutocompleteSection} ${AutocompleteGroup} ${AutocompleteField}`\n | 'on'\n | 'off'", - "description": "A hint about the intended content of the field for browser autofill.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "isOptional": true, - "defaultValue": "'on' for everything else" + "name": "minBlockSize", + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "controls", - "value": "'auto' | 'stepper' | 'none'", - "description": "The type of controls displayed in the field.\n\n- `stepper`: displays buttons to increase or decrease the value of the field by the stepping interval defined in the `step` property. Appropriate mouse and [keyboard interactions](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/spinbutton_role#keyboard_interactions) to control the value of the field are enabled.\n- `none`: no controls are displayed and users must input the value manually. Arrow keys and scroll wheels can’t be used either to avoid accidental changes.\n- `auto`: the presence of the controls depends on the surface and context.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "minInlineSize", + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultValue", - "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "isOptional": true + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", - "isOptional": true + "name": "padding", + "value": "MaybeResponsive>", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", - "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", - "isOptional": true, - "defaultValue": "false" + "name": "paddingBlock", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", - "isOptional": true + "name": "paddingBlockEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", - "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", - "isOptional": true + "name": "paddingBlockStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", - "isOptional": true + "name": "paddingInline", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "labelAccessibilityVisibility", - "value": "'visible' | 'exclusive'", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", - "isOptional": true, - "defaultValue": "'visible'" + "name": "paddingInlineEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "max", - "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", - "isOptional": true, - "defaultValue": "Infinity" + "name": "paddingInlineStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "min", - "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", - "isOptional": true, - "defaultValue": "-Infinity" - }, + "name": "rowGap", + "value": "MaybeResponsive<\"\" | SpacingKeyword>", + "description": "The spacing between children in the block axis (vertical in horizontal writing modes). This property overrides the row spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'' - meaning no override" + } + ], + "value": "export interface StackProps\n extends BoxProps,\n Pick<\n Required,\n 'justifyContent' | 'alignItems' | 'alignContent'\n > {\n /**\n * Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n *\n * Use this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.\n *\n * @default 'normal'\n */\n justifyContent: JustifyContentKeyword;\n /**\n * Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n *\n * Use this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.\n *\n * @default 'normal'\n */\n alignItems: AlignItemsKeyword;\n /**\n * Controls the distribution of lines along the block axis when content wraps into multiple lines.\n *\n * This property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.\n *\n * @default 'normal'\n */\n alignContent: AlignContentKeyword;\n /**\n * The spacing between children in the stack. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value to apply the same spacing to both axes (for example, `'large-100'`), or a pair of values (for example, `'large-100 large-500'`) to set different spacing for the block and inline axes. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default 'none'\n */\n gap: ResponsiveStackProps['gap'];\n /**\n * The spacing between children in the block axis (vertical in horizontal writing modes). This property overrides the row spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default '' - meaning no override\n */\n rowGap: ResponsiveStackProps['rowGap'];\n /**\n * The spacing between children in the inline axis (horizontal in left-to-right languages). This property overrides the column spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default '' - meaning no override\n */\n columnGap: ResponsiveStackProps['columnGap'];\n /**\n * The direction in which the stack's children are laid out. Use `'inline'` to arrange children horizontally (with wrapping enabled), or `'block'` to arrange them vertically (without wrapping). This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default 'block'\n *\n * @implementation The content will wrap if the direction is `'inline'`, and won't wrap if the direction is `'block'`.\n */\n direction: ResponsiveStackProps['direction'];\n}" + } + }, + "StackJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "StackJSXProps", + "description": "The properties for the stack component when it's used in JSX.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "name", + "name": "accessibilityLabel", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onBlur", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", - "isOptional": true + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onChange", - "value": "(event: Event) => void", - "description": "A callback fired when the user has finished editing the field, such as when they blur the field or press Enter. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", - "isOptional": true + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onFocus", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", - "isOptional": true + "name": "alignContent", + "value": "AlignContentKeyword", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "defaultValue": "'normal'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onInput", - "value": "(event: Event) => void", - "description": "A callback fired when the user makes any changes in the field, such as typing a character. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).", - "isOptional": true + "name": "alignItems", + "value": "AlignItemsKeyword", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "defaultValue": "'normal'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "placeholder", - "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", - "isOptional": true + "name": "background", + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", + "defaultValue": "'transparent'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "readOnly", - "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", - "isOptional": true, - "defaultValue": "false" + "name": "blockSize", + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "required", - "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "step", - "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", - "isOptional": true, - "defaultValue": "1" + "name": "borderColor", + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "value", - "value": "string", - "description": "", - "isOptional": true - } - ] - } - }, - "PasswordFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "PasswordFieldProps", - "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required<\n Pick<\n PasswordFieldProps$1,\n | 'defaultValue'\n | 'details'\n | 'disabled'\n | 'error'\n | 'labelAccessibilityVisibility'\n | 'minLength'\n | 'maxLength'\n | 'label'\n | 'name'\n | 'placeholder'\n | 'readOnly'\n | 'required'\n | 'value'\n >\n >", - "description": "Represents the props for password input field components. Extends `PreactFieldProps` with autocomplete support for password-related fields.", - "isPublicDocs": true - } - }, - "Popover": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Popover", - "description": "Configure the following properties on the popover component.", - "isPublicDocs": true, - "members": [ + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", + "defaultValue": "'none'" + }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "blockSize", - "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about the [block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "defaultValue": "'auto'" + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "minBlockSize", - "value": "SizeUnits", - "description": "The minimum vertical size of the element in standard layouts (min-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the block axis.\n\nLearn more about the [min-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", - "defaultValue": "'0'" + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "maxBlockSize", - "value": "SizeUnitsOrNone", - "description": "The maximum vertical size of the element in standard layouts (max-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the block axis.\n\nLearn more about the [max-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", - "defaultValue": "'none'" + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The child elements to render inside the stack.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "inlineSize", - "value": "SizeUnitsOrAuto", - "description": "The horizontal size of the element in standard layouts (width in left-to-right or right-to-left writing modes).\n\nInline size adjusts based on the writing direction: in horizontal layouts, it controls the width; in vertical layouts, it controls the height. This ensures consistent behavior across different text directions.\n\nLearn more about the [inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "defaultValue": "'auto'" + "syntaxKind": "PropertySignature", + "name": "columnGap", + "value": "MaybeResponsive<\"\" | SpacingKeyword>", + "description": "The spacing between children in the inline axis (horizontal in left-to-right languages). This property overrides the column spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "minInlineSize", - "value": "SizeUnits", - "description": "The minimum horizontal size of the element in standard layouts (min-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the inline axis.\n\nLearn more about the [min-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", - "defaultValue": "'0'" + "syntaxKind": "PropertySignature", + "name": "direction", + "value": "MaybeResponsive<\"inline\" | \"block\">", + "description": "The direction in which the stack's children are laid out. Use `'inline'` to arrange children horizontally (with wrapping enabled), or `'block'` to arrange them vertically (without wrapping). This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'block'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "maxInlineSize", - "value": "SizeUnitsOrNone", - "description": "The maximum horizontal size of the element in standard layouts (max-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the inline axis.\n\nLearn more about the [max-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", - "defaultValue": "'none'" + "syntaxKind": "PropertySignature", + "name": "display", + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@2598", - "value": "boolean", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "gap", + "value": "MaybeResponsive>", + "description": "The spacing between children in the stack. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value to apply the same spacing to both axes (for example, `'large-100'`), or a pair of values (for example, `'large-100 large-500'`) to set different spacing for the block and inline axes. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@2599", - "value": "HTMLElement", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@2600", - "value": "number", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "justifyContent", + "value": "JustifyContentKeyword", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "defaultValue": "'normal'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - } - ], - "value": "declare class Popover\n extends PreactPopoverElement\n implements PopoverProps\n{\n constructor();\n}" - } - }, - "SearchFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "SearchFieldProps", - "value": "PreactFieldProps<\n /**\n * @default 'on'\n */\n Required['autocomplete']\n> & Required<\n Pick<\n TextFieldProps$1,\n | 'defaultValue'\n | 'details'\n | 'disabled'\n | 'error'\n | 'labelAccessibilityVisibility'\n | 'minLength'\n | 'maxLength'\n | 'label'\n | 'name'\n | 'placeholder'\n | 'readOnly'\n | 'required'\n | 'value'\n >\n >", - "description": "Represents the props for search input field components. Extends `PreactFieldProps` for search-specific functionality.", - "isPublicDocs": true - } - }, - "RequiredSectionProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RequiredSectionProps", - "value": "Required", - "description": "Represents the section component props with all properties marked as required.", - "isPublicDocs": true, - "members": [ + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "MaybeResponsive>", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", + "defaultValue": "'none'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", - "isOptional": true + "name": "paddingBlock", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The content displayed within the section component, which groups related elements together in a logical unit with an optional heading.", - "isOptional": true + "name": "paddingBlockEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "heading", - "value": "string", - "description": "The heading text displayed at the top of the section. This heading provides a title for the section's content and automatically uses the appropriate semantic heading level (h2, h3, h4) based on nesting depth to maintain proper document structure.", - "isOptional": true + "name": "paddingBlockStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", - "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", - "isOptional": true + "name": "paddingInline", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "padding", - "value": "'base' | 'none'", - "description": "The padding applied to all edges of the element.\n\n- `base`: applies padding that is appropriate for the element. Note that it might result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the section need to span to the edge of the section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", - "isOptional": true, - "defaultValue": "'base'" + "name": "paddingInlineEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "primaryAction", - "value": "ComponentChildren", - "description": "The primary action button or link, representing the main or most important action available in this context. Typically displayed with higher visual prominence than secondary actions to establish clear hierarchy.", - "isOptional": true + "name": "paddingInlineStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondaryActions", - "value": "ComponentChildren", - "description": "Additional action buttons or links that provide alternative or supporting actions. Visually de-emphasized compared to the primary action.", - "isOptional": true + "name": "rowGap", + "value": "MaybeResponsive<\"\" | SpacingKeyword>", + "description": "The spacing between children in the block axis (vertical in horizontal writing modes). This property overrides the row spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'' - meaning no override" } - ] + ], + "value": "export interface StackJSXProps\n extends Partial,\n Pick {\n /**\n * The child elements to render inside the stack.\n */\n children?: ComponentChildren;\n}" } }, - "AlignedStackProps": { + "SwitchProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "AlignedStackProps", - "value": "Required", - "description": "Represents the stack component props with all properties marked as required.", + "name": "SwitchProps", + "description": "Properties for rendering a switch that lets users toggle a setting on or off with a sliding control interface.", "isPublicDocs": true, "members": [ { @@ -19261,391 +25478,361 @@ "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityRole", - "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "name": "checked", + "value": "boolean", + "description": "Whether the control is active.", "isOptional": true, - "defaultValue": "'generic'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityVisibility", - "value": "'visible' | 'hidden' | 'exclusive'", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "name": "defaultChecked", + "value": "boolean", + "description": "Whether the control is active by default.", "isOptional": true, - "defaultValue": "'visible'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "alignContent", - "value": "MaybeResponsive", - "description": "The alignment of multiple lines of content along the stack component's cross axis.\n\nThis only applies when content wraps to multiple lines (typically in inline direction).\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isOptional": true, - "defaultValue": "'normal'" + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "alignItems", - "value": "MaybeResponsive", - "description": "The alignment of individual children along the stack component's cross axis (perpendicular to the stacking direction).\n\nFor example, in a vertical stack (block direction), this controls horizontal alignment of each child.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", + "name": "disabled", + "value": "boolean", + "description": "Disables the control, disallowing any interaction.", "isOptional": true, - "defaultValue": "'normal'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "background", - "value": "BackgroundColorKeyword", - "description": "The background color of the element. Use `transparent` for no background, `subdued` for a subtle background, `base` for standard background, or `strong` for a prominent background.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isOptional": true, - "defaultValue": "'transparent'" + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blockSize", - "value": "MaybeResponsive", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about the [block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "label", + "value": "string | ComponentChildren", + "description": "Visual content to use as the control label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "border", - "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.\n\nAccepts a size value, optionally followed by a color, optionally followed by a style. Omitted values use defaults: color defaults to `base`, style defaults to `auto`.\n\nIndividual properties (`borderWidth`, `borderStyle`, `borderColor`) can override values set here.", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderColor", - "value": "ColorKeyword | ''", - "description": "The color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "name", + "value": "string", + "description": "An identifier for the control that is unique within the nearest containing `Form` component.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- One value: applies to all corners\n- Two values: applies to start corners (top-left & bottom-right) and end corners (top-right & bottom-left) respectively\n- Three values: applies to start-start (top-left), end corners (top-right & bottom-left), and end-end (bottom-right) respectively\n- Four values: applies to start-start (top-left), start-end (top-right), end-end (bottom-right), and end-start (bottom-left) respectively\n\nExamples:\n- `small-100`: All corners have `small-100` radius\n- `small-100 none`: Top-left and bottom-right are `small-100`, top-right and bottom-left are `none`\n- `small-100 none large-100`: Top-left is `small-100`, top-right and bottom-left are `none`, bottom-right is `large-100`\n- `small-100 none large-100 base`: Each corner has its specified radius value", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderStyle", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted.\n\nWhen set, this overrides the style value specified in the `border` property.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different styles per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "value", + "value": "string", + "description": "" + } + ], + "value": "export interface SwitchProps\n extends PreactCheckboxProps,\n Required> {}" + } + }, + "SwitchJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SwitchJSXProps", + "description": "Properties for using the switch component in JSX with React-style event handlers.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderWidth", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", + "name": "checked", + "value": "boolean", + "description": "Whether the control is active.", "isOptional": true, - "defaultValue": "'' - meaning no override" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The child elements displayed within the stack component, which are arranged vertically or horizontally with consistent spacing.", - "isOptional": true + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "columnGap", - "value": "MaybeResponsive", - "description": "The horizontal spacing between elements (in horizontal writing modes).\n\nSets the gap along the inline axis. This overrides the column value specified in `gap`.", + "name": "defaultChecked", + "value": "boolean", + "description": "Whether the control is active by default.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "direction", - "value": "MaybeResponsive<'block' | 'inline'>", - "description": "The direction in which children are arranged within the stack.\n\n- `block`: Arranges children vertically in a column (in horizontal writing modes). Children will not wrap.\n- `inline`: Arranges children horizontally in a row (in horizontal writing modes). Children will wrap to the next line if needed.\n\nThis uses [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values) to ensure proper behavior across different writing modes.", - "isOptional": true, - "defaultValue": "'block'" + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "display", - "value": "MaybeResponsive<'auto' | 'none'>", - "description": "The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n\nLearn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).", + "name": "disabled", + "value": "boolean", + "description": "Disables the control, disallowing any interaction.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gap", - "value": "MaybeResponsive>", - "description": "The spacing between child elements.\n\nAccepts a single value to apply to both axes, or two space-separated values to set the row and column gaps independently. For example: `large-100 large-500` sets the row gap to `large-100` and column gap to `large-500`.", - "isOptional": true, - "defaultValue": "'none'" + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "inlineSize", - "value": "MaybeResponsive", - "description": "The horizontal size of the element in standard layouts (width in left-to-right or right-to-left writing modes).\n\nInline size adjusts based on the writing direction: in horizontal layouts, it controls the width; in vertical layouts, it controls the height. This ensures consistent behavior across different text directions.\n\nLearn more about the [inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "label", + "value": "string | ComponentChildren", + "description": "Visual content to use as the control label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "justifyContent", - "value": "MaybeResponsive", - "description": "The distribution of children along the stack component's main axis (the direction of stacking).\n\nFor example, in a vertical stack (block direction), this controls vertical distribution. Use this to space out children or align them to the start, center, or end.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "'normal'" + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxBlockSize", - "value": "MaybeResponsive", - "description": "The maximum vertical size of the element in standard layouts (max-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the block axis.\n\nLearn more about the [max-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", - "isOptional": true, - "defaultValue": "'none'" + "name": "name", + "value": "string", + "description": "An identifier for the control that is unique within the nearest containing `Form` component.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxInlineSize", - "value": "MaybeResponsive", - "description": "The maximum horizontal size of the element in standard layouts (max-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the inline axis.\n\nLearn more about the [max-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", - "isOptional": true, - "defaultValue": "'none'" + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minBlockSize", - "value": "MaybeResponsive", - "description": "The minimum vertical size of the element in standard layouts (min-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the block axis.\n\nLearn more about the [min-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", - "isOptional": true, - "defaultValue": "'0'" + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the switch's checked state changes and it loses focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minInlineSize", - "value": "MaybeResponsive", - "description": "The minimum horizontal size of the element in standard layouts (min-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the inline axis.\n\nLearn more about the [min-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", - "isOptional": true, - "defaultValue": "'0'" + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the switch's checked state changes as the user interacts with it.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "overflow", - "value": "'hidden' | 'visible'", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "isOptional": true, - "defaultValue": "'visible'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "padding", - "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding.", - "isOptional": true, - "defaultValue": "'none'" - }, + "name": "value", + "value": "string", + "description": "" + } + ], + "value": "export interface SwitchJSXProps\n extends Partial,\n Pick {\n /**\n * A callback that's triggered when the switch's checked state changes and it loses focus.\n */\n onChange?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the switch's checked state changes as the user interacts with it.\n */\n onInput?: ((event: CallbackEvent) => void) | null;\n onBlur?: ((event: CallbackEvent) => void) | null;\n}" + } + }, + "TableProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "TableProps", + "description": "The properties you can set on a table component.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlock", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`.", + "name": "hasNextPage", + "value": "boolean", + "description": "Whether there's an additional page of data.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockEnd", - "value": "MaybeResponsive", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`.", + "name": "hasPreviousPage", + "value": "boolean", + "description": "Whether there's a previous page of data.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockStart", - "value": "MaybeResponsive", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`.", + "name": "loading", + "value": "boolean", + "description": "Whether the table is in a loading state, such as initial page load or loading the next page in a paginated table. When true, the table could be in an inert state, which prevents user interaction.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInline", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`.", + "name": "paginate", + "value": "boolean", + "description": "Whether to use pagination controls.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineEnd", - "value": "MaybeResponsive", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" - }, + "name": "variant", + "value": "'auto' | 'list'", + "description": "The display variant of the table. Use `list` to force a list view, or `auto` to automatically switch between table and list based on the available space.", + "defaultValue": "'auto'" + } + ], + "value": "export interface TableProps\n extends Required<\n Pick<\n TableProps$1,\n 'loading' | 'paginate' | 'hasPreviousPage' | 'hasNextPage' | 'variant'\n >\n > {\n /**\n * The display variant of the table. Use `list` to force a list view, or `auto` to automatically switch between table and list based on the available space.\n */\n variant: Extract;\n}" + } + }, + "TableHeaderProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "TableHeaderProps", + "description": "The properties you can set on a table header component.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineStart", - "value": "MaybeResponsive", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "format", + "value": "HeaderFormat", + "description": "The format of the header, which affects how the cell content is aligned and displayed. Use `base` for standard text, `currency` for monetary values, or `numeric` for numbers.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "rowGap", - "value": "MaybeResponsive", - "description": "The vertical spacing between elements (in horizontal writing modes).\n\nSets the gap along the block axis. This overrides the row value specified in `gap`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "listSlot", + "value": "'primary' | 'secondary' | 'inline' | 'kicker' | 'labeled'", + "description": "The slot where this header's data appears in list view. The options include `primary` for the main content, `secondary` for supporting text, `labeled` for labeled data, `kicker` for small text above the primary content, or `inline` for inline content.", + "defaultValue": "'labeled'" } - ] + ], + "value": "export interface TableHeaderProps\n extends Pick {\n /**\n * The slot where this header's data appears in list view. The options include `primary` for the main content, `secondary` for supporting text, `labeled` for labeled data, `kicker` for small text above the primary content, or `inline` for inline content.\n */\n listSlot: Extract<\n TableHeaderProps$1['listSlot'],\n 'primary' | 'secondary' | 'labeled' | 'kicker' | 'inline'\n >;\n /**\n * The format of the header, which affects how the cell content is aligned and displayed. Use `base` for standard text, `currency` for monetary values, or `numeric` for numbers.\n */\n format: HeaderFormat;\n}" } }, - "ResponsiveStackProps": { + "TableJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ResponsiveStackProps", - "value": "MakeResponsivePick<\n AlignedStackProps,\n 'gap' | 'rowGap' | 'columnGap' | 'direction'\n>", - "description": "Represents stack props with responsive capabilities for layout properties.\n\nThis enables conditional styling based on container queries.", + "name": "TableJSXProps", + "description": "The JSX properties you can set on a table component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "columnGap", - "value": "MaybeResponsive", - "description": "The horizontal spacing between elements (in horizontal writing modes).\n\nSets the gap along the inline axis. This overrides the column value specified in `gap`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "children", + "value": "ComponentChildren", + "description": "The content to display inside the table, which should include table header row, table body, and table row components.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "direction", - "value": "MaybeResponsive<'block' | 'inline'>", - "description": "The direction in which children are arranged within the stack.\n\n- `block`: Arranges children vertically in a column (in horizontal writing modes). Children will not wrap.\n- `inline`: Arranges children horizontally in a row (in horizontal writing modes). Children will wrap to the next line if needed.\n\nThis uses [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values) to ensure proper behavior across different writing modes.", - "isOptional": true, - "defaultValue": "'block'" + "name": "filters", + "value": "ComponentChildren", + "description": "Additional filters to display in the table. For example, you can use the search field component to filter the table data.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gap", - "value": "MaybeResponsive>", - "description": "The spacing between child elements.\n\nAccepts a single value to apply to both axes, or two space-separated values to set the row and column gaps independently. For example: `large-100 large-500` sets the row gap to `large-100` and column gap to `large-500`.", + "name": "hasNextPage", + "value": "boolean", + "description": "Whether there's an additional page of data.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "rowGap", - "value": "MaybeResponsive", - "description": "The vertical spacing between elements (in horizontal writing modes).\n\nSets the gap along the block axis. This overrides the row value specified in `gap`.", + "name": "hasPreviousPage", + "value": "boolean", + "description": "Whether there's a previous page of data.", "isOptional": true, - "defaultValue": "'' - meaning no override" - } - ] - } - }, - "TextAreaProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "TextAreaProps", - "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required>", - "description": "Represents the props for textarea components. Extends `PreactFieldProps` for multi-line text input functionality.", - "isPublicDocs": true - } - }, - "URLFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "URLFieldProps", - "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required>", - "description": "Represents the props for URL input field components. Extends `PreactFieldProps` with autocomplete support for URL-related fields.", - "isPublicDocs": true - } - }, - "AdminActionProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AdminActionProps", - "description": "Configure the following properties on the admin action component.", - "isPublicDocs": true, - "members": [ + "defaultValue": "false" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "heading", + "name": "id", "value": "string", - "description": "The text to use as the action modal's title. If not provided, the name of the extension will be used.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -19653,1914 +25840,1948 @@ "syntaxKind": "PropertySignature", "name": "loading", "value": "boolean", - "description": "Whether the action is in a loading state, such as during initial page load or when the action is being opened. When `true`, the action is in an inert state that prevents user interaction.", + "description": "Whether the table is in a loading state, such as initial page load or loading the next page in a paginated table. When true, the table could be in an inert state, which prevents user interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onNextPage", + "value": "(event: Event) => void", + "description": "Called when the next page button is clicked.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onPreviousPage", + "value": "(event: Event) => void", + "description": "Called when the previous page button is clicked.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paginate", + "value": "boolean", + "description": "Whether to use pagination controls.", "isOptional": true, "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "variant", + "value": "'auto' | 'list'", + "description": "The display variant of the table. Use `list` to force a list view, or `auto` to automatically switch between table and list based on the available space.", + "defaultValue": "'auto'" } ], - "value": "export interface AdminActionProps\n extends Pick {}" + "value": "export interface TableJSXProps\n extends Partial,\n Pick {\n /**\n * The content to display inside the table, which should include table header row, table body, and table row components.\n */\n children?: ComponentChildren;\n /**\n * Additional filters to display in the table. For example, you can use the search field component to filter the table data.\n */\n filters?: ComponentChildren;\n}" } }, - "AdminBlockProps": { + "TableBodyProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "AdminBlockProps", - "description": "Configure the following properties on the admin block component.", + "name": "TableBodyProps", + "description": "The properties you can set on a table body component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "collapsedSummary", - "value": "string", - "description": "The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated.", + "name": "children", + "value": "ComponentChildren", + "description": "The body of the table. May not have any semantic meaning in the Table's `list` variant.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "heading", + "name": "id", "value": "string", - "description": "The text displayed as the block's title in the header. If not provided, the extension name will be used.", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface AdminBlockProps\n extends Pick {}" + "value": "export interface TableBodyProps extends TableBodyProps$1 {}" } }, - "AdminPrintActionProps": { + "TableBodyJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "AdminPrintActionProps", - "description": "Configure the following properties on the admin print action component.", + "name": "TableBodyJSXProps", + "description": "The JSX properties you can set on a table body component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "src", + "name": "children", + "value": "ComponentChildren", + "description": "The body content of the table, which should include table row components. This content might not have any semantic meaning when the table uses the `list` variant.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", "value": "string", - "description": "The URL of the document to preview and print. Supports HTML, PDF, and image formats. If not provided, the preview will show an empty state and the print button will be disabled.", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface AdminPrintActionProps\n extends Pick {}" - } - }, - "FunctionSettingsErrorEvent": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "FunctionSettingsErrorEvent", - "value": "AggregateErrorEvent", - "description": "Represents the event type for function settings errors. Extracted from the parameters of the `onFunctionSettingsError` callback.", - "isPublicDocs": true + "value": "export interface TableBodyJSXProps\n extends Partial,\n Pick {\n /**\n * The body content of the table, which should include table row components. This content might not have any semantic meaning when the table uses the `list` variant.\n */\n children?: ComponentChildren;\n}" } }, - "AvatarEvents": { + "TableCellProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "AvatarEvents", - "description": "The avatar component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "TableCellProps", + "description": "The properties you can set on a table cell component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", - "value": "OnErrorEventHandler", - "description": "A callback fired when the avatar image fails to load.\n\nLearn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event)." + "name": "children", + "value": "ComponentChildren", + "description": "The content of the table cell.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "load", - "value": "CallbackEventListener | null", - "description": "A callback fired when the avatar image successfully loads.\n\nLearn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event)." + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true } ], - "value": "export interface AvatarEvents {\n /**\n * A callback fired when the avatar image successfully loads.\n *\n * Learn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback fired when the avatar image fails to load.\n *\n * Learn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).\n */\n error: OnErrorEventHandler = null;\n}" + "value": "export interface TableCellProps extends TableCellProps$1 {}" } }, - "BadgeSlots": { + "TableCellJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BadgeSlots", - "description": "The badge component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "TableCellJSXProps", + "description": "The JSX properties you can set on a table cell component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", - "value": "HTMLElement", - "description": "The text label displayed within the badge component, typically a short status indicator or category label.", + "value": "ComponentChildren", + "description": "The content to display inside the table cell.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface BadgeSlots {\n /**\n * The text label displayed within the badge component, typically a short status indicator or category label.\n */\n children?: HTMLElement;\n}" + "value": "export interface TableCellJSXProps\n extends Partial,\n Pick {\n /**\n * The content to display inside the table cell.\n */\n children?: ComponentChildren;\n}" } }, - "BannerEvents": { + "TableHeaderJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BannerEvents", - "description": "The banner component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "TableHeaderJSXProps", + "description": "The JSX properties you can set on a table header component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "afterhide", - "value": "CallbackEventListener | null", - "description": "A callback fired after the banner is hidden." + "name": "children", + "value": "ComponentChildren", + "description": "The heading of the column when the table uses the `table` variant, and the label of its data when the table uses the `list` variant.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "dismiss", - "value": "CallbackEventListener | null", - "description": "A callback fired when the banner is dismissed." - } - ], - "value": "export interface BannerEvents {\n /**\n * A callback fired when the banner is dismissed.\n */\n dismiss: CallbackEventListener | null = null;\n /**\n * A callback fired after the banner is hidden.\n */\n afterhide: CallbackEventListener | null = null;\n}" - } - }, - "BannerSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "BannerSlots", - "description": "The banner component supports slots for additional content placement within the banner. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "format", + "value": "HeaderFormat", + "description": "The format of the header, which affects how the cell content is aligned and displayed. Use `base` for standard text, `currency` for monetary values, or `numeric` for numbers." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The main message content displayed within the banner component, providing important information or guidance to users.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondary-actions", - "value": "HTMLElement", - "description": "Action buttons displayed at the bottom of the banner that let users respond to the message. Accepts up to two button components with `variant=\"secondary\"` or `variant=\"auto\"`.", - "isOptional": true + "name": "listSlot", + "value": "'primary' | 'secondary' | 'inline' | 'kicker' | 'labeled'", + "description": "The slot where this header's data appears in list view. The options include `primary` for the main content, `secondary` for supporting text, `labeled` for labeled data, `kicker` for small text above the primary content, or `inline` for inline content.", + "defaultValue": "'labeled'" } ], - "value": "export interface BannerSlots {\n /**\n * The main message content displayed within the banner component, providing important information or guidance to users.\n */\n children?: HTMLElement;\n /**\n * Action buttons displayed at the bottom of the banner that let users respond to the message.\n * Accepts up to two button components with `variant=\"secondary\"` or `variant=\"auto\"`.\n */\n 'secondary-actions'?: HTMLElement;\n}" + "value": "export interface TableHeaderJSXProps\n extends Partial,\n Pick {\n /**\n * The heading of the column when the table uses the `table` variant, and the label of its data when the table uses the `list` variant.\n */\n children?: ComponentChildren;\n}" } }, - "BoxSlots": { + "TableHeaderRowProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BoxSlots", - "description": "The box component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "TableHeaderRowProps", + "description": "The properties you can set on a table header row component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", - "value": "HTMLElement", - "description": "The content displayed within the box component, which serves as a flexible container for organizing and styling other components.", + "value": "ComponentChildren", + "description": "Contents of the table heading row; children should be `TableHeading` components.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface BoxSlots {\n /**\n * The content displayed within the box component, which serves as a flexible container for organizing and styling other components.\n */\n children?: HTMLElement;\n}" + "value": "export interface TableHeaderRowProps extends TableHeaderRowProps$1 {}" } }, - "ButtonEvents": { + "TableHeaderRowJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ButtonEvents", - "description": "The button component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "TableHeaderRowJSXProps", + "description": "The JSX properties you can set on a table header row component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener | null", - "description": "A callback fired when the button loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "click", - "value": "CallbackEventListener | null", - "description": "A callback fired when the button is clicked.\n\nLearn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event)." + "name": "children", + "value": "ComponentChildren", + "description": "The content to display inside the table header row, which should include table header components.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener | null", - "description": "A callback fired when the button receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true } ], - "value": "export interface ButtonEvents {\n /**\n * A callback fired when the button is clicked.\n *\n * Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n click: CallbackEventListener | null = null;\n /**\n * A callback fired when the button loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener | null = null;\n /**\n * A callback fired when the button receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener | null = null;\n}" + "value": "export interface TableHeaderRowJSXProps\n extends Partial,\n Pick {\n /**\n * The content to display inside the table header row, which should include table header components.\n */\n children?: ComponentChildren;\n}" } }, - "ButtonSlots": { + "TableRowProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ButtonSlots", - "description": "The button component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "TableRowProps", + "description": "The properties you can set on a table row component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", - "value": "HTMLElement", - "description": "The label text or elements displayed inside the button component, describing the action that will be performed when clicked.", + "value": "ComponentChildren", + "description": "The content of a TableRow, which should be `TableCell` components.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "clickDelegate", + "value": "string", + "description": "The ID of an interactive element (e.g. `s-link`) in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally.", "isOptional": true } ], - "value": "export interface ButtonSlots {\n /**\n * The label text or elements displayed inside the button component, describing the action that will be performed when clicked.\n */\n children?: HTMLElement;\n}" + "value": "export interface TableRowProps\n extends Pick {}" } }, - "ButtonGroupSlots": { + "TableRowJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ButtonGroupSlots", - "description": "The button group component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "TableRowJSXProps", + "description": "The JSX properties you can set on a table row component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", - "value": "HTMLElement", - "description": "The buttons displayed within the button group component, which are arranged together as a cohesive set of related actions.", + "value": "ComponentChildren", + "description": "The content to display inside the row, which should include table cell components.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "primary-action", - "value": "HTMLElement", - "description": "The main action for this group, displayed with high visual emphasis. Accepts a single button with `variant=\"primary\"`.\n\nUse this for the primary action you want users to take. This can't be used when `gap=\"none\"`.", + "name": "clickDelegate", + "value": "string", + "description": "The ID of an interactive element (e.g. `s-link`) in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondary-actions", - "value": "HTMLElement", - "description": "Supporting actions displayed with less emphasis than the primary action. Accepts one or more button components with `variant=\"secondary\"` or `variant=\"auto\"`.\n\nUse these for alternative or less critical actions.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface ButtonGroupSlots {\n /**\n * The buttons displayed within the button group component, which are arranged together as a cohesive set of related actions.\n */\n children?: HTMLElement;\n /**\n * The main action for this group, displayed with high visual emphasis.\n * Accepts a single button with `variant=\"primary\"`.\n *\n * Use this for the primary action you want users to take. This can't be used when `gap=\"none\"`.\n */\n 'primary-action'?: HTMLElement;\n /**\n * Supporting actions displayed with less emphasis than the primary action.\n * Accepts one or more button components with `variant=\"secondary\"` or `variant=\"auto\"`.\n *\n * Use these for alternative or less critical actions.\n */\n 'secondary-actions'?: HTMLElement;\n}" + "value": "export interface TableRowJSXProps\n extends Partial,\n Pick {\n /**\n * The content to display inside the row, which should include table cell components.\n */\n children?: ComponentChildren;\n}" } }, - "CheckboxEvents": { + "TextProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "CheckboxEvents", - "description": "The checkbox component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "TextProps", + "description": "", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the checkbox value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the checkbox.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface CheckboxEvents {\n /**\n * A callback fired when the checkbox value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the checkbox.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n}" - } - }, - "ChipSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ChipSlots", - "description": "The chip component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "color", + "value": "'base' | 'subdued'", + "description": "The color of the text. Available options:\n- `'base'` - The default text color.\n- `'subdued'` - A lighter text color for secondary information.", + "defaultValue": "'base'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The text label displayed within the chip component, typically representing a selected filter, tag, or removable item.", - "isOptional": true + "name": "dir", + "value": "'ltr' | 'rtl' | 'auto' | ''", + "description": "Indicates the directionality of the element’s text.\n\n- `ltr`: languages written from left to right (e.g. English)\n- `rtl`: languages written from right to left (e.g. Arabic)\n- `auto`: the user agent determines the direction based on the content\n- `''`: direction is inherited from parent elements (equivalent to not setting the attribute)", + "isOptional": true, + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "graphic", - "value": "HTMLElement", - "description": "An optional icon to display at the start of the chip. Accepts only icon components.", + "name": "fontVariantNumeric", + "value": "'auto' | 'normal' | 'tabular-nums'", + "description": "The numeric font variant for the text. Available options:\n- `'auto'` - The font variant is automatically determined.\n- `'normal'` - Standard numeric rendering.\n- `'tabular-nums'` - Monospaced numbers for better alignment in tables.", + "defaultValue": "'auto' - inherit from the parent element" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto' | 'neutral' | 'caution'", + "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "type", + "value": "'strong' | 'generic' | 'address' | 'redundant'", + "description": "The semantic type and styling treatment for the text content.\n\nOther presentation properties on Text override the default styling.\n\n- `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n- `generic`: Standard text with no special semantic meaning or styling.\n- `address`: Marks the text as contact information, such as a physical or email address.\n- `redundant`: Indicates the text is redundant or duplicated information for screen reader context.", + "defaultValue": "'generic'" } ], - "value": "export interface ChipSlots {\n /**\n * The text label displayed within the chip component, typically representing a selected filter, tag, or removable item.\n */\n children?: HTMLElement;\n /**\n * An optional icon to display at the start of the chip. Accepts only icon components.\n */\n graphic?: HTMLElement;\n}" + "value": "export interface TextProps\n extends Required<\n Pick<\n TextProps$1,\n | 'accessibilityVisibility'\n | 'dir'\n | 'color'\n | 'type'\n | 'tone'\n | 'fontVariantNumeric'\n | 'interestFor'\n >\n > {\n /**\n * The color of the text. Available options:\n * - `'base'` - The default text color.\n * - `'subdued'` - A lighter text color for secondary information.\n */\n color: Extract;\n /**\n * The semantic type and styling treatment for the text content.\n *\n * Other presentation properties on Text override the default styling.\n *\n * - `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n * - `generic`: Standard text with no special semantic meaning or styling.\n * - `address`: Marks the text as contact information, such as a physical or email address.\n * - `redundant`: Indicates the text is redundant or duplicated information for screen reader context.\n *\n * @default 'generic'\n */\n type: Extract<\n TextProps$1['type'],\n 'address' | 'redundant' | 'strong' | 'generic'\n >;\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n *\n * @default 'auto'\n */\n tone: Extract<\n TextProps$1['tone'],\n 'auto' | 'neutral' | 'info' | 'success' | 'warning' | 'caution' | 'critical'\n >;\n /**\n * The numeric font variant for the text. Available options:\n * - `'auto'` - The font variant is automatically determined.\n * - `'normal'` - Standard numeric rendering.\n * - `'tabular-nums'` - Monospaced numbers for better alignment in tables.\n */\n fontVariantNumeric: Extract<\n TextProps$1['fontVariantNumeric'],\n 'auto' | 'normal' | 'tabular-nums'\n >;\n}" } }, - "ChoiceSlots": { + "TextJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ChoiceSlots", - "description": "The choice list component supports slots for additional content placement within each choice. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "TextJSXProps", + "description": "The JSX properties for the text component. These properties define how text is rendered in Preact or JSX.", "isPublicDocs": true, "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", - "value": "HTMLElement", - "description": "The label text or elements that identify this selectable choice to users.\n\nThe label is produced by extracting and concatenating the text nodes from the provided content; any markup or element structure is ignored.", + "value": "ComponentChildren", + "description": "The content of the text.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "details", - "value": "HTMLElement", - "description": "Additional text to provide context or guidance for the input.\n\nThis text is displayed along with the input and its label to offer more information or instructions to the user.", + "name": "color", + "value": "'base' | 'subdued'", + "description": "The color of the text. Available options:\n- `'base'` - The default text color.\n- `'subdued'` - A lighter text color for secondary information.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "dir", + "value": "'ltr' | 'rtl' | 'auto' | ''", + "description": "Indicates the directionality of the element’s text.\n\n- `ltr`: languages written from left to right (e.g. English)\n- `rtl`: languages written from right to left (e.g. Arabic)\n- `auto`: the user agent determines the direction based on the content\n- `''`: direction is inherited from parent elements (equivalent to not setting the attribute)", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "fontVariantNumeric", + "value": "'auto' | 'normal' | 'tabular-nums'", + "description": "The numeric font variant for the text. Available options:\n- `'auto'` - The font variant is automatically determined.\n- `'normal'` - Standard numeric rendering.\n- `'tabular-nums'` - Monospaced numbers for better alignment in tables.", + "defaultValue": "'auto' - inherit from the parent element" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true - } - ], - "value": "export interface ChoiceSlots {\n /**\n * The label text or elements that identify this selectable choice to users.\n *\n * The label is produced by extracting and\n * concatenating the text nodes from the provided content;\n * any markup or element structure is ignored.\n */\n children?: HTMLElement;\n /**\n * Additional text to provide context or guidance for the input.\n *\n * This text is displayed along with the input and its label\n * to offer more information or instructions to the user.\n *\n * @implementation this content should be linked to the input with an `aria-describedby` attribute.\n */\n details?: HTMLElement;\n}" - } - }, - "ChoiceListEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ChoiceListEvents", - "description": "The choice list component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener | null", - "description": "A callback fired when the choice list selection changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto' | 'neutral' | 'caution'", + "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener | null", - "description": "A callback fired when the user inputs data into the choice list.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." + "name": "type", + "value": "'strong' | 'generic' | 'address' | 'redundant'", + "description": "The semantic type and styling treatment for the text content.\n\nOther presentation properties on Text override the default styling.\n\n- `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n- `generic`: Standard text with no special semantic meaning or styling.\n- `address`: Marks the text as contact information, such as a physical or email address.\n- `redundant`: Indicates the text is redundant or duplicated information for screen reader context.", + "defaultValue": "'generic'" } ], - "value": "export interface ChoiceListEvents {\n /**\n * A callback fired when the choice list selection changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener | null = null;\n /**\n * A callback fired when the user inputs data into the choice list.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener | null = null;\n}" + "value": "export interface TextJSXProps\n extends Partial,\n Pick {\n /**\n * The content of the text.\n */\n children?: ComponentChildren;\n}" } }, - "ChoiceListSlots": { + "TextAreaProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ChoiceListSlots", - "description": "The choice list component supports slots for additional content placement within each choice. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The choices a user can select from.\n\nAccepts choice components.", - "isOptional": true - } - ], - "value": "export interface ChoiceListSlots {\n /**\n * The choices a user can select from.\n *\n * Accepts choice components.\n */\n children?: HTMLElement;\n}" + "syntaxKind": "TypeAliasDeclaration", + "name": "TextAreaProps", + "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required>", + "description": "The properties for the text area component. These properties configure a multi-line text input field that allows merchants to enter and edit longer text content.", + "isPublicDocs": true } }, - "ClickableEvents": { + "TextAreaJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ClickableEvents", - "description": "The clickable component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "TextAreaJSXProps", + "description": "The JSX props for the text area component. These properties extend `TextAreaProps` with JSX-specific event callbacks for React-style event handling.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener | null", - "description": "A callback fired when the component loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "click", - "value": "CallbackEventListener | null", - "description": "A callback fired when the component is clicked.\n\nLearn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event)." + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener | null", - "description": "A callback fired when the component receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." - } - ], - "value": "export interface ClickableEvents {\n /**\n * A callback fired when the component is clicked.\n *\n * Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n click: CallbackEventListener | null = null;\n /**\n * A callback fired when the component loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener | null = null;\n /**\n * A callback fired when the component receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener | null = null;\n}" - } - }, - "ClickableSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ClickableSlots", - "description": "The clickable component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The content displayed within the clickable component, which makes any content interactive and clickable without the semantic meaning of a button or link.", - "isOptional": true - } - ], - "value": "export interface ClickableSlots {\n /**\n * The content displayed within the clickable component, which makes any content interactive and clickable without the semantic meaning of a button or link.\n */\n children?: HTMLElement;\n}" - } - }, - "ClickableChipEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ClickableChipEvents", - "description": "The clickable chip component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "maxLength", + "value": "number", + "description": "Specifies the maximum number of characters allowed.", + "isOptional": true, + "defaultValue": "Infinity" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "afterhide", - "value": "CallbackEventListener | null", - "description": "A callback fired after the chip is hidden." + "name": "minLength", + "value": "number", + "description": "Specifies the min number of characters allowed.", + "isOptional": true, + "defaultValue": "0" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "click", - "value": "CallbackEventListener | null", - "description": "A callback fired when the chip is clicked.\n\nLearn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event)." + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "remove", - "value": "CallbackEventListener | null", - "description": "A callback fired when the chip is removed." - } - ], - "value": "export interface ClickableChipEvents {\n /**\n * A callback fired when the chip is clicked.\n *\n * Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n click: CallbackEventListener | null = null;\n /**\n * A callback fired when the chip is removed.\n */\n remove: CallbackEventListener | null = null;\n /**\n * A callback fired after the chip is hidden.\n */\n afterhide: CallbackEventListener | null = null;\n}" - } - }, - "ClickableChipSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ClickableChipSlots", - "description": "The clickable chip component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The text label displayed within the chip, which represents an interactive filter, tag, or selectable item.", + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user has finished editing the field, such as when they blur the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "graphic", - "value": "HTMLElement", - "description": "An optional icon to display at the start of the chip. Accepts only icon components.", + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", "isOptional": true - } - ], - "value": "export interface ClickableChipSlots {\n /**\n * The text label displayed within the chip, which represents an interactive filter, tag, or selectable item.\n */\n children?: HTMLElement;\n /**\n * An optional icon to display at the start of the chip. Accepts only icon components.\n */\n graphic?: HTMLElement;\n}" - } - }, - "ColorFieldEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ColorFieldEvents", - "description": "The color field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the color field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user makes changes to the field value. This fires before `onChange`.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the color field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the color field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the color field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface ColorFieldEvents {\n /**\n * A callback fired when the color field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the color field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the color field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the color field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" - } - }, - "ColorPickerEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ColorPickerEvents", - "description": "The color picker component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener | null", - "description": "A callback fired when the color picker value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "rows", + "value": "number", + "description": "A number of visible text lines.", + "isOptional": true, + "defaultValue": "2" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener | null", - "description": "A callback fired when the user inputs data into the color picker.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", + "isOptional": true } ], - "value": "export interface ColorPickerEvents {\n /**\n * A callback fired when the color picker value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener | null = null;\n /**\n * A callback fired when the user inputs data into the color picker.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener | null = null;\n}" + "value": "export interface TextAreaJSXProps\n extends Partial>,\n Pick,\n FieldReactProps,\n FieldSlotInternalReactProps {}" } }, - "DateFieldEvents": { + "TextFieldJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "DateFieldEvents", - "description": "The date field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "TextFieldJSXProps", + "description": "The JSX props for the text field component. These properties extend `TextFieldProps` with JSX-specific event callbacks and an accessory slot for rendering additional content at the end of the field.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the date field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "accessory", + "value": "ComponentChildren", + "description": "An accessory element to display at the end of the text field, such as a button, icon, or other interactive component. This appears inside the field's visual boundary, typically for actions like clearing the field or showing additional options.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the date field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the date field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the date field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "invalid", - "value": "CallbackEventListener | null", - "description": "A callback fired when the date field value is invalid.\n\nLearn more about the [invalid event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/invalid_event)." + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "viewchange", - "value": "CallbackEventListener | null", - "description": "A callback fired when the calendar view changes (such as when navigating between months)." - } - ], - "value": "export interface DateFieldEvents {\n /**\n * A callback fired when the date field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the date field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the date field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the date field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n /**\n * A callback fired when the calendar view changes (such as when navigating between months).\n */\n viewchange: CallbackEventListener | null = null;\n /**\n * A callback fired when the date field value is invalid.\n *\n * Learn more about the [invalid event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/invalid_event).\n */\n invalid: CallbackEventListener | null = null;\n}" - } - }, - "DatePickerEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "DatePickerEvents", - "description": "The date picker component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener | null", - "description": "A callback fired when the date picker loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "icon", + "value": "IconType | AnyString", + "description": "The type of icon to be displayed in the field.", + "isOptional": true, + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener | null", - "description": "A callback fired when the date picker value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener | null", - "description": "A callback fired when the date picker receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener | null", - "description": "A callback fired when the user inputs data into the date picker.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "viewchange", - "value": "CallbackEventListener | null", - "description": "A callback fired when the calendar view changes, such as when navigating between months." - } - ], - "value": "export interface DatePickerEvents {\n /**\n * A callback fired when the calendar view changes, such as when navigating between months.\n */\n viewchange: CallbackEventListener | null = null;\n /**\n * A callback fired when the date picker receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener | null = null;\n /**\n * A callback fired when the date picker loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener | null = null;\n /**\n * A callback fired when the user inputs data into the date picker.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener | null = null;\n /**\n * A callback fired when the date picker value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener | null = null;\n}" - } - }, - "DropZoneEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "DropZoneEvents", - "description": "The drop zone component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "maxLength", + "value": "number", + "description": "Specifies the maximum number of characters allowed.", + "isOptional": true, + "defaultValue": "Infinity" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener", - "description": "A callback fired when the drop zone value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "minLength", + "value": "number", + "description": "Specifies the min number of characters allowed.", + "isOptional": true, + "defaultValue": "0" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "droprejected", - "value": "CallbackEventListener", - "description": "A callback fired when a dropped file is rejected due to file type or size restrictions." + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener", - "description": "A callback fired when the user inputs data into the drop zone.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface DropZoneEvents {\n /**\n * A callback fired when the drop zone value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener = null;\n /**\n * A callback fired when the user inputs data into the drop zone.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener = null;\n /**\n * A callback fired when a dropped file is rejected due to file type or size restrictions.\n */\n droprejected: CallbackEventListener = null;\n}" - } - }, - "DropZoneSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "DropZoneSlots", - "description": "The drop zone component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The content to include inside the drop zone container", + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user has finished editing the field, such as when they blur the field.", "isOptional": true - } - ], - "value": "export interface DropZoneSlots {\n /**\n * The content to include inside the drop zone container\n */\n children?: HTMLElement;\n}" - } - }, - "EmailFieldEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "EmailFieldEvents", - "description": "The email field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the email field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the email field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user makes changes to the field value. This fires before `onChange`.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the email field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the email field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface EmailFieldEvents {\n /**\n * A callback fired when the email field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the email field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the email field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the email field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" - } - }, - "GridSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "GridSlots", - "description": "The grid component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "prefix", + "value": "string", + "description": "A value to be displayed immediately before the editable portion of the field.\n\nThis is useful for displaying an implied part of the value, such as \"https://\" or \"+353\".\n\nThis cannot be edited by the user, and it isn't included in the value of the field.\n\nIt may not be displayed until the user has interacted with the input. For example, an inline label may take the place of the prefix until the user focuses the input.", + "isOptional": true, + "defaultValue": "''" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The child elements displayed within the grid component, which are arranged in a flexible grid layout with configurable columns, rows, and spacing.", - "isOptional": true - } - ], - "value": "export interface GridSlots {\n /**\n * The child elements displayed within the grid component, which are arranged in a flexible grid layout with configurable columns, rows, and spacing.\n */\n children?: HTMLElement;\n}" - } - }, - "GridItemSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "GridItemSlots", - "description": "The grid item component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The content displayed within the grid item component, which represents a single cell in the grid layout and can span multiple columns or rows.", - "isOptional": true - } - ], - "value": "export interface GridItemSlots {\n /**\n * The content displayed within the grid item component, which represents a single cell in the grid layout and can span multiple columns or rows.\n */\n children?: HTMLElement;\n}" - } - }, - "HeadingSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "HeadingSlots", - "description": "The heading component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The heading text displayed within the heading component, which provides a title or section header for content.", + "name": "suffix", + "value": "string", + "description": "A value to be displayed immediately after the editable portion of the field.\n\nThis is useful for displaying an implied part of the value, such as \"@shopify.com\", or \"%\".\n\nThis cannot be edited by the user, and it isn't included in the value of the field.\n\nIt may not be displayed until the user has interacted with the input. For example, an inline label may take the place of the suffix until the user focuses the input.", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true } ], - "value": "export interface HeadingSlots {\n /**\n * The heading text displayed within the heading component, which provides a title or section header for content.\n */\n children?: HTMLElement;\n}" + "value": "export interface TextFieldJSXProps\n extends Partial>,\n Pick,\n FieldReactProps,\n FieldSlotInternalReactProps {\n /**\n * An accessory element to display at the end of the text field, such as a button, icon, or other interactive component. This appears inside the field's visual boundary, typically for actions like clearing the field or showing additional options.\n */\n accessory?: ComponentChildren;\n}" } }, - "ImageEvents": { + "ThumbnailProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ImageEvents", - "description": "The image component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "ThumbnailProps", + "description": "The properties for the thumbnail component. A thumbnail displays a small preview image with configurable sizing. Properties include `src` for the image URL, `alt` for accessibility text, and `size` for controlling the thumbnail dimensions.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", - "value": "OnErrorEventHandler", - "description": "A callback fired when the image fails to load.\n\nLearn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event)." + "name": "alt", + "value": "string", + "description": "Alternative text that describes the image for screen readers. This text should convey the meaning or content of the image to users who can't see it.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "load", - "value": "CallbackEventListener | null", - "description": "A callback fired when the image successfully loads.\n\nLearn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event)." - } - ], - "value": "export interface ImageEvents {\n /**\n * A callback fired when the image successfully loads.\n *\n * Learn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback fired when the image fails to load.\n *\n * Learn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).\n */\n error: OnErrorEventHandler = null;\n}" - } - }, - "LinkEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "LinkEvents", - "description": "The link component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "size", + "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100'", + "description": "The size of the thumbnail. Choose from `'small-200'`, `'small-100'`, `'small'`, `'base'`, `'large'`, or `'large-100'` to control the thumbnail dimensions.", + "defaultValue": "'base'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "click", - "value": "CallbackEventListener | null", - "description": "A callback fired when the link is clicked.\n\nLearn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event)." + "name": "src", + "value": "string", + "description": "The URL of the image to display in the thumbnail. You can provide an absolute or relative URL pointing to the image file." } ], - "value": "export interface LinkEvents {\n /**\n * A callback fired when the link is clicked.\n *\n * Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n click: CallbackEventListener | null = null;\n}" + "value": "export interface ThumbnailProps\n extends Required> {\n /**\n * The URL of the image to display in the thumbnail. You can provide an absolute or relative URL pointing to the image file.\n */\n src: ThumbnailProps$1['src'];\n /**\n * Alternative text that describes the image for screen readers. This text should convey the meaning or content of the image to users who can't see it.\n */\n alt: ThumbnailProps$1['alt'];\n /**\n * The size of the thumbnail. Choose from `'small-200'`, `'small-100'`, `'small'`, `'base'`, `'large'`, or `'large-100'` to control the thumbnail dimensions.\n *\n * @default 'base'\n */\n size: Extract<\n ThumbnailProps$1['size'],\n 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100'\n >;\n}" } }, - "LinkSlots": { + "ThumbnailJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "LinkSlots", - "description": "The link component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "ThumbnailJSXProps", + "description": "The properties for the thumbnail component when it's used in JSX.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The text or elements displayed within the link component, which navigates users to a different location when activated.", + "name": "alt", + "value": "string", + "description": "Alternative text that describes the image for screen readers. This text should convey the meaning or content of the image to users who can't see it.", + "defaultValue": "`''`" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true - } - ], - "value": "export interface LinkSlots {\n /**\n * The text or elements displayed within the link component, which navigates users to a different location when activated.\n */\n children?: HTMLElement;\n}" - } - }, - "ListItemSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ListItemSlots", - "description": "The list item component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The content displayed within the list item, which represents a single entry in an ordered or unordered list.", + "name": "onError", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired when the image fails to load.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onLoad", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired when the image has loaded successfully.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "size", + "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100'", + "description": "The size of the thumbnail. Choose from `'small-200'`, `'small-100'`, `'small'`, `'base'`, `'large'`, or `'large-100'` to control the thumbnail dimensions.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "src", + "value": "string", + "description": "The URL of the image to display in the thumbnail. You can provide an absolute or relative URL pointing to the image file." } ], - "value": "export interface ListItemSlots {\n /**\n * The content displayed within the list item, which represents a single entry in an ordered or unordered list.\n */\n children?: HTMLElement;\n}" + "value": "export interface ThumbnailJSXProps\n extends Partial,\n Pick {\n /**\n * A callback that's fired when the image has loaded successfully.\n */\n onLoad?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's fired when the image fails to load.\n */\n onError?: ((event: CallbackEvent) => void) | null;\n}" } }, - "MenuSlots": { + "TooltipProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "MenuSlots", - "description": "The menu component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "TooltipProps", + "description": "The properties you can set on a tooltip component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The items displayed within the menu. Only accepts button and section components. Use button for individual menu actions and section to group related items.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface MenuSlots {\n /**\n * The items displayed within the menu. Only accepts button and section components. Use button for individual menu actions and section to group related items.\n */\n children?: HTMLElement;\n}" + "value": "export interface TooltipProps extends Required> {}" } }, - "ModalEvents": { + "TooltipJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ModalEvents", - "description": "The modal component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "TooltipJSXProps", + "description": "The JSX properties you can set on a tooltip component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "afterhide", - "value": "CallbackEventListener | null", - "description": "A callback fired after the modal is hidden." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "aftershow", - "value": "CallbackEventListener | null", - "description": "A callback fired after the modal is shown." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "hide", - "value": "CallbackEventListener | null", - "description": "A callback fired when the modal is hidden." + "name": "children", + "value": "ComponentChildren", + "description": "The content to display inside the tooltip, which should include text or paragraph components, or raw text content.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "show", - "value": "CallbackEventListener | null", - "description": "A callback fired when the modal is shown." + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true } ], - "value": "export interface ModalEvents {\n /**\n * A callback fired when the modal is hidden.\n */\n hide: CallbackEventListener | null = null;\n /**\n * A callback fired when the modal is shown.\n */\n show: CallbackEventListener | null = null;\n /**\n * A callback fired after the modal is hidden.\n */\n afterhide: CallbackEventListener | null = null;\n /**\n * A callback fired after the modal is shown.\n */\n aftershow: CallbackEventListener | null = null;\n}" + "value": "export interface TooltipJSXProps\n extends Partial,\n Pick {\n /**\n * The content to display inside the tooltip, which should include text or paragraph components, or raw text content.\n */\n children?: ComponentChildren;\n}" + } + }, + "URLFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "URLFieldProps", + "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required>", + "description": "The properties for the URL field component. These properties configure an input field that allows merchants to enter and validate web addresses (URLs) with built-in validation.", + "isPublicDocs": true } }, - "ModalSlots": { + "URLFieldJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ModalSlots", - "description": "The modal component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "URLFieldJSXProps", + "description": "The JSX props for the URL field component. These properties extend `URLFieldProps` with JSX-specific event callbacks for React-style event handling when used in Preact.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The content displayed within the modal component, typically including form fields, information, or interactive elements.", - "isOptional": true + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "primary-action", - "value": "HTMLElement", - "description": "The main action button displayed in the modal footer, representing the primary action users should take.\n\nOnly accepts a single button component with a `variant` of `primary`. This action should align with the modal's main purpose.", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondary-actions", - "value": "HTMLElement", - "description": "Additional action buttons displayed in the modal footer, providing alternative or supporting actions.\n\nOnly accepts button components with a `variant` of `secondary` or `auto`. These are visually de-emphasized to establish clear hierarchy.", + "name": "details", + "value": "preact.ComponentChildren", + "description": "", "isOptional": true - } - ], - "value": "export interface ModalSlots {\n /**\n * The content displayed within the modal component, typically including form fields, information, or interactive elements.\n */\n children?: HTMLElement;\n /**\n * The main action button displayed in the modal footer, representing the primary action users should take.\n *\n * Only accepts a single button component with a `variant` of `primary`. This action should align with the modal's main purpose.\n */\n 'primary-action'?: HTMLElement;\n /**\n * Additional action buttons displayed in the modal footer, providing alternative or supporting actions.\n *\n * Only accepts button components with a `variant` of `secondary` or `auto`. These are visually de-emphasized to establish clear hierarchy.\n */\n 'secondary-actions'?: HTMLElement;\n}" - } - }, - "MoneyFieldEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "MoneyFieldEvents", - "description": "The money field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the money field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the money field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the money field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the money field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface MoneyFieldEvents {\n /**\n * A callback fired when the money field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the money field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the money field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the money field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" - } - }, - "NumberFieldEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "NumberFieldEvents", - "description": "The number field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the number field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the number field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "maxLength", + "value": "number", + "description": "Specifies the maximum number of characters allowed.", + "isOptional": true, + "defaultValue": "Infinity" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the number field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "minLength", + "value": "number", + "description": "Specifies the min number of characters allowed.", + "isOptional": true, + "defaultValue": "0" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the number field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface NumberFieldEvents {\n /**\n * A callback fired when the number field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the number field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the number field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the number field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" - } - }, - "OptionSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "OptionSlots", - "description": "The option component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The text or elements displayed as the option label, which identifies the selectable choice to users in a dropdown or selection list.", + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", "isOptional": true - } - ], - "value": "export interface OptionSlots {\n /**\n * The text or elements displayed as the option label, which identifies the selectable choice to users in a dropdown or selection list.\n */\n children?: HTMLElement;\n}" - } - }, - "OptionGroupSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "OptionGroupSlots", - "description": "The option group component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The selectable options displayed in the dropdown list. Accepts option components for individual selectable items within this group.", + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user has finished editing the field, such as when they blur the field.", "isOptional": true - } - ], - "value": "export interface OptionGroupSlots {\n /**\n * The selectable options displayed in the dropdown list. Accepts option components for individual selectable items within this group.\n */\n children?: HTMLElement;\n}" - } - }, - "OrderedListSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "OrderedListSlots", - "description": "The ordered list component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The list entries displayed within the ordered list, where each item is numbered sequentially. Only accepts list item components as children. Each list item represents a single numbered entry in the sequence.", + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", "isOptional": true - } - ], - "value": "export interface OrderedListSlots {\n /**\n * The list entries displayed within the ordered list, where each item is numbered sequentially. Only accepts list item components as children. Each list item represents a single numbered entry in the sequence.\n */\n children?: HTMLElement;\n}" - } - }, - "PageSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "PageSlots", - "description": "The page component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "aside", - "value": "HTMLElement", - "description": "The content to display in the aside section of the page.\n\nThis slot is only rendered when `inlineSize` is \"base\".", + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user makes changes to the field value. This fires before `onChange`.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "breadcrumb-actions", - "value": "HTMLElement", - "description": "The navigation back actions for the page.\n\nOnly accepts link components.", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The main page content displayed within the page component, which serves as the primary container for the page's information and interface elements.", - "isOptional": true + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "primary-action", - "value": "HTMLElement", - "description": "The primary action for the page.\n\nOnly accepts a single button component with a `variant` of `primary`.", - "isOptional": true + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondary-actions", - "value": "HTMLElement", - "description": "The secondary actions for the page.\n\nOnly accepts button group and button components with a `variant` of `secondary` or `auto`.", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true } ], - "value": "export interface PageSlots {\n /**\n * The main page content displayed within the page component, which serves as the primary container for the page's information and interface elements.\n */\n children?: HTMLElement;\n /**\n * The content to display in the aside section of the page.\n *\n * This slot is only rendered when `inlineSize` is \"base\".\n */\n aside?: HTMLElement;\n /**\n * The primary action for the page.\n *\n * Only accepts a single button component with a `variant` of `primary`.\n *\n */\n 'primary-action'?: HTMLElement;\n /**\n * The secondary actions for the page.\n *\n * Only accepts button group and button components with a `variant` of `secondary` or `auto`.\n */\n 'secondary-actions'?: HTMLElement;\n /**\n * The navigation back actions for the page.\n *\n * Only accepts link components.\n */\n 'breadcrumb-actions'?: HTMLElement;\n}" + "value": "export interface URLFieldJSXProps\n extends Partial>,\n Pick,\n FieldReactProps,\n FieldSlotInternalReactProps {}" } }, - "ParagraphSlots": { + "UnorderedListProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ParagraphSlots", - "description": "The paragraph component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "UnorderedListProps", + "description": "The properties for the unordered list component. These properties define a bulleted list of items where the order doesn't matter.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", - "value": "HTMLElement", - "description": "The paragraph text content displayed within the paragraph component, which presents a block of related text with appropriate styling.", + "value": "ComponentChildren", + "description": "The content of the UnorderededList.\n\nAccepts only `ListItem` components.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface ParagraphSlots {\n /**\n * The paragraph text content displayed within the paragraph component, which presents a block of related text with appropriate styling.\n */\n children?: HTMLElement;\n}" + "value": "export interface UnorderedListProps extends UnorderedListProps$1 {}" } }, - "PasswordFieldEvents": { + "UnorderedListJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "PasswordFieldEvents", - "description": "The password field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "UnorderedListJSXProps", + "description": "The JSX properties for the unordered list component. These properties define how an unordered list is rendered in Preact or JSX.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the password field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "children", + "value": "ComponentChildren", + "description": "The items in the unordered list. Only list item components are accepted.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the password field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." - }, + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface UnorderedListJSXProps\n extends Partial,\n Pick {\n /**\n * The items in the unordered list. Only list item components are accepted.\n */\n children?: ComponentChildren;\n}" + } + }, + "AdminActionProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "AdminActionProps", + "description": "The properties for the admin action component. These properties configure the heading and loading state of the admin action extension interface.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the password field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "heading", + "value": "string", + "description": "The text to use as the Action modal’s title. If not provided, the name of the extension will be used.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the password field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." + "name": "loading", + "value": "boolean", + "description": "Whether the action is in a loading state, such as initial page load or action opening. When true, the action could be in an inert state, which prevents user interaction.", + "isOptional": true, + "defaultValue": "false" } ], - "value": "export interface PasswordFieldEvents {\n /**\n * A callback fired when the password field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the password field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the password field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the password field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface AdminActionProps\n extends Pick {}" } }, - "PopoverEvents": { + "AdminActionJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "PopoverEvents", - "description": "The popover component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "AdminActionJSXProps", + "description": "The JSX props for the admin action component. These properties extend `AdminActionProps` with slots for primary and secondary action buttons that merchants can interact with.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "afterhide", - "value": "CallbackEventListener | null", - "description": "A callback fired after the popover is hidden." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "aftershow", - "value": "CallbackEventListener | null", - "description": "A callback fired after the popover is shown." + "name": "heading", + "value": "string", + "description": "The text to use as the Action modal’s title. If not provided, the name of the extension will be used.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "aftertoggle", - "value": "CallbackEventListener | null", - "description": "A callback fired after the popover is toggled." + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "hide", - "value": "CallbackEventListener | null", - "description": "A callback fired when the popover is hidden." + "name": "loading", + "value": "boolean", + "description": "Whether the action is in a loading state, such as initial page load or action opening. When true, the action could be in an inert state, which prevents user interaction.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "show", - "value": "CallbackEventListener | null", - "description": "A callback fired when the popover is shown." + "name": "primaryAction", + "value": "ComponentChildren", + "description": "The primary action button or link to display in the admin action area. This is the main call-to-action that appears prominently in the interface. Typically uses a button component with `variant=\"primary\"` to complete or advance the workflow." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "toggle", - "value": "CallbackEventListener | null", - "description": "A callback fired when the popover is toggled." + "name": "secondaryActions", + "value": "ComponentChildren", + "description": "The secondary action buttons or links to display in the admin action area. These are supporting actions like cancel, back, or alternative operations. Typically uses button components with `variant=\"secondary\"` or `variant=\"tertiary\"`." } ], - "value": "export interface PopoverEvents {\n /**\n * A callback fired when the popover is shown.\n */\n show: CallbackEventListener | null;\n /**\n * A callback fired when the popover is hidden.\n */\n hide: CallbackEventListener | null;\n /**\n * A callback fired after the popover is shown.\n */\n aftershow: CallbackEventListener | null;\n /**\n * A callback fired after the popover is hidden.\n */\n afterhide: CallbackEventListener | null;\n /**\n * A callback fired when the popover is toggled.\n */\n toggle: CallbackEventListener | null;\n /**\n * A callback fired after the popover is toggled.\n */\n aftertoggle: CallbackEventListener | null;\n}" + "value": "export interface AdminActionJSXProps\n extends Partial,\n Pick {\n /**\n * The primary action button or link to display in the admin action area. This is the main call-to-action that appears prominently in the interface. Typically uses a button component with `variant=\"primary\"` to complete or advance the workflow.\n */\n primaryAction: ComponentChildren;\n /**\n * The secondary action buttons or links to display in the admin action area. These are supporting actions like cancel, back, or alternative operations. Typically uses button components with `variant=\"secondary\"` or `variant=\"tertiary\"`.\n */\n secondaryActions: ComponentChildren;\n}" } }, - "PopoverSlots": { + "AdminBlockProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "PopoverSlots", - "description": "The popover component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "AdminBlockProps", + "description": "The properties for the admin block component. These properties configure the heading and collapsed summary of collapsible content blocks in the admin interface.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The content displayed within the popover component, which appears in an overlay positioned relative to its trigger element.", + "name": "collapsedSummary", + "value": "string", + "description": "The summary to display when the app block is collapsed. Summary longer than 30 characters will be truncated.", "isOptional": true - } - ], - "value": "export interface PopoverSlots {\n /**\n * The content displayed within the popover component, which appears in an overlay positioned relative to its trigger element.\n */\n children?: HTMLElement;\n}" - } - }, - "QueryContainerSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "QueryContainerSlots", - "description": "The query container component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The content displayed within the query container component, which enables container queries for responsive styling based on the container's size rather than the viewport.", + "name": "heading", + "value": "string", + "description": "The text to use as the Block title in the block header. If not provided, the name of the extension will be used.", "isOptional": true } ], - "value": "export interface QueryContainerSlots {\n /**\n * The content displayed within the query container component, which enables container queries for responsive styling based on the container's size rather than the viewport.\n */\n children?: HTMLElement;\n}" + "value": "export interface AdminBlockProps\n extends Pick {}" } }, - "SearchFieldEvents": { + "AdminBlockJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "SearchFieldEvents", - "description": "The search field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "AdminBlockJSXProps", + "description": "The JSX props for the admin block component. These properties extend `AdminBlockProps` with an optional `id` for element identification in JSX rendering.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the search field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the search field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "collapsedSummary", + "value": "string", + "description": "The summary to display when the app block is collapsed. Summary longer than 30 characters will be truncated.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the search field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "heading", + "value": "string", + "description": "The text to use as the Block title in the block header. If not provided, the name of the extension will be used.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the search field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true } ], - "value": "export interface SearchFieldEvents {\n /**\n * A callback fired when the search field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the search field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the search field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the search field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface AdminBlockJSXProps\n extends Partial,\n Pick {}" } }, - "SectionSlots": { + "AdminPrintActionProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "SectionSlots", - "description": "The section component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "AdminPrintActionProps", + "description": "The properties for the admin print action component. These properties configure the source URL for printing content within admin extensions.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The content displayed within the section component, which groups related elements together in a logical unit with an optional heading.", + "name": "src", + "value": "string", + "description": "Sets the src URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs and images are supported.", "isOptional": true } ], - "value": "export interface SectionSlots {\n /**\n * The content displayed within the section component, which groups related elements together in a logical unit with an optional heading.\n */\n children?: HTMLElement;\n}" + "value": "export interface AdminPrintActionProps\n extends Pick {}" } }, - "SelectEvents": { + "AdminPrintActionJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "SelectEvents", - "description": "The select component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "AdminPrintActionJSXProps", + "description": "The JSX props for the admin print action component. These properties extend `AdminPrintActionProps` with an optional `id` for element identification in JSX rendering.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the select value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the select.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." + "name": "src", + "value": "string", + "description": "Sets the src URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs and images are supported.", + "isOptional": true } ], - "value": "export interface SelectEvents {\n /**\n * A callback fired when the select value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the select.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n}" + "value": "export interface AdminPrintActionJSXProps\n extends Partial,\n Pick {}" } }, - "SelectSlots": { + "FormProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "SelectSlots", - "description": "The select component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "FormProps", + "description": "The properties for the form component. These properties configure the form's identifier for targeting and referencing within the admin extension.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The selectable options displayed in the dropdown list. Accepts option components for individual selectable items, and option group components to organize related options into logical groups with labels.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface SelectSlots {\n /**\n * The selectable options displayed in the dropdown list. Accepts option components for individual selectable items, and option group components to organize related options into logical groups with labels.\n */\n children?: HTMLElement;\n}" + "value": "export interface FormProps extends Pick {}" } }, - "StackSlots": { + "FormJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "StackSlots", - "description": "The stack component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "FormJSXProps", + "description": "The JSX props for the form component. These properties extend `FormProps` with event callbacks for form submission and reset actions in JSX rendering.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The child elements displayed within the stack component, which are arranged vertically or horizontally with consistent spacing.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true - } - ], - "value": "export interface StackSlots {\n /**\n * The child elements displayed within the stack component, which are arranged vertically or horizontally with consistent spacing.\n */\n children?: HTMLElement;\n}" - } - }, - "SwitchEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "SwitchEvents", - "description": "The switch component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the switch value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "onReset", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's invoked when the form is reset, restoring all form fields to their initial values.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the switch.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." + "name": "onSubmit", + "value": "| ((event: CallbackExtendableEvent) => void)\n | null", + "description": "A callback that's invoked when the form is submitted. Use the event's `waitUntil` method to perform async operations like validation or data processing before the submission completes.", + "isOptional": true } ], - "value": "export interface SwitchEvents {\n /**\n * A callback fired when the switch value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the switch.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n}" + "value": "export interface FormJSXProps extends Partial {\n /**\n * A callback that's invoked when the form is submitted. Use the event's `waitUntil` method to perform async operations like validation or data processing before the submission completes.\n */\n onSubmit?:\n | ((event: CallbackExtendableEvent) => void)\n | null;\n /**\n * A callback that's invoked when the form is reset, restoring all form fields to their initial values.\n */\n onReset?: ((event: CallbackEvent) => void) | null;\n}" } }, - "TableEvents": { + "CallbackExtendableEvent": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "TableEvents", - "description": "The table component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "name": "CallbackExtendableEvent", + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "nextpage", - "value": "CallbackEventListener | null", - "description": "A callback fired when the user navigates to the next page." + "name": "AT_TARGET", + "value": "2", + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "previouspage", - "value": "CallbackEventListener | null", - "description": "A callback fired when the user navigates to the previous page." - } - ], - "value": "export interface TableEvents {\n /**\n * A callback fired when the user navigates to the previous page.\n */\n previouspage: CallbackEventListener | null = null;\n /**\n * A callback fired when the user navigates to the next page.\n */\n nextpage: CallbackEventListener | null = null;\n}" - } - }, - "TableSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TableSlots", - "description": "The table component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "bubbles", + "value": "boolean", + "description": "The **`bubbles`** read-only property of the Event interface indicates whether the event bubbles up through the DOM tree or not.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/bubbles)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The table structure defining headers and data rows.\n\nAccepts table header row (for column headers) and table body (for data rows) components. Structure your table with a table header row first, followed by table body.", - "isOptional": true + "name": "BUBBLING_PHASE", + "value": "3", + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "filters", - "value": "HTMLElement", - "description": "Filter controls displayed above the table.\n\nAccepts input components like search field or select for filtering table data. These controls appear in a dedicated area above the table content.", - "isOptional": true - } - ], - "value": "export interface TableSlots {\n /**\n * The table structure defining headers and data rows.\n *\n * Accepts table header row (for column headers) and table body (for data rows) components. Structure your table with a table header row first, followed by table body.\n */\n children?: HTMLElement;\n /**\n * Filter controls displayed above the table.\n *\n * Accepts input components like search field or select for filtering table data. These controls appear in a dedicated area above the table content.\n */\n filters?: HTMLElement;\n}" - } - }, - "TableBodySlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TableBodySlots", - "description": "The table body component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "cancelable", + "value": "boolean", + "description": "The **`cancelable`** read-only property of the Event interface indicates whether the event can be canceled, and therefore prevented as if the event never happened.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelable)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The data rows displayed in the table body.\n\nAccepts table row components, with each row representing a single record or entry in the table.", - "isOptional": true - } - ], - "value": "export interface TableBodySlots {\n /**\n * The data rows displayed in the table body.\n *\n * Accepts table row components, with each row representing a single record or entry in the table.\n */\n children?: HTMLElement;\n}" - } - }, - "TableCellSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TableCellSlots", - "description": "The table cell component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "cancelBubble", + "value": "boolean", + "description": "The **`cancelBubble`** property of the Event interface is deprecated.", + "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelBubble)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The data value displayed in this cell.\n\nAccepts text content or inline components representing the cell's data value.", + "name": "CAPTURING_PHASE", + "value": "1", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "composed", + "value": "boolean", + "description": "The read-only **`composed`** property of the or not the event will propagate across the shadow DOM boundary into the standard DOM.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composed)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "composedPath", + "value": "() => EventTarget[]", + "description": "The **`composedPath()`** method of the Event interface returns the event's path which is an array of the objects on which listeners will be invoked.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composedPath)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "currentTarget", + "value": "EventTarget | null", + "description": "The **`currentTarget`** read-only property of the Event interface identifies the element to which the event handler has been attached.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/currentTarget)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultPrevented", + "value": "boolean", + "description": "The **`defaultPrevented`** read-only property of the Event interface returns a boolean value indicating whether or not the call to Event.preventDefault() canceled the event.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/defaultPrevented)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "eventPhase", + "value": "number", + "description": "The **`eventPhase`** read-only property of the being evaluated.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/eventPhase)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "initEvent", + "value": "(type: string, bubbles?: boolean, cancelable?: boolean) => void", + "description": "The **`Event.initEvent()`** method is used to initialize the value of an event created using Document.createEvent().", + "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/initEvent)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "isTrusted", + "value": "boolean", + "description": "The **`isTrusted`** read-only property of the when the event was generated by the user agent (including via user actions and programmatic methods such as HTMLElement.focus()), and `false` when the event was dispatched via The only exception is the `click` event, which initializes the `isTrusted` property to `false` in user agents.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/isTrusted)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "NONE", + "value": "0", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "preventDefault", + "value": "() => void", + "description": "The **`preventDefault()`** method of the Event interface tells the user agent that if the event does not get explicitly handled, its default action should not be taken as it normally would be.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/preventDefault)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "returnValue", + "value": "boolean", + "description": "The Event property **`returnValue`** indicates whether the default action for this event has been prevented or not.", + "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/returnValue)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "srcElement", + "value": "EventTarget | null", + "description": "The deprecated **`Event.srcElement`** is an alias for the Event.target property.", + "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/srcElement)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "stopImmediatePropagation", + "value": "() => void", + "description": "The **`stopImmediatePropagation()`** method of the If several listeners are attached to the same element for the same event type, they are called in the order in which they were added.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopImmediatePropagation)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "stopPropagation", + "value": "() => void", + "description": "The **`stopPropagation()`** method of the Event interface prevents further propagation of the current event in the capturing and bubbling phases.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopPropagation)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "target", + "value": "EventTarget | null", + "description": "The read-only **`target`** property of the dispatched.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/target)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "timeStamp", + "value": "DOMHighResTimeStamp", + "description": "The **`timeStamp`** read-only property of the Event interface returns the time (in milliseconds) at which the event was created.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/timeStamp)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "type", + "value": "string", + "description": "The **`type`** read-only property of the Event interface returns a string containing the event's type.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/type)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "waitUntil", + "value": "(promise: Promise) => void", + "description": "Provide a promise that signals the length, and eventual success or failure of actions relating to the event.\n\nThis may be called many times, which adds promises to the event.\n\nHowever, this may only be called synchronously during the dispatch of the event. As in, you cannot call it after a `setTimeout` or microtask.", "isOptional": true } ], - "value": "export interface TableCellSlots {\n /**\n * The data value displayed in this cell.\n *\n * Accepts text content or inline components representing the cell's data value.\n */\n children?: HTMLElement;\n}" + "value": "export interface CallbackExtendableEvent<\n TTagName extends keyof HTMLElementTagNameMap,\n> extends CallbackEvent,\n Pick {}" } }, - "TableHeaderSlots": { + "FunctionSettingsProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "TableHeaderSlots", - "description": "The table header component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "FunctionSettingsProps", + "description": "The properties for the function settings component. These properties configure the form's identifier for configuring Shopify Function settings in the admin interface.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The column heading text.\n\nThis text labels the column in table variant and appears as a label for data in list variant.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface TableHeaderSlots {\n /**\n * The column heading text.\n *\n * This text labels the column in table variant and appears as a label for data in list variant.\n */\n children?: HTMLElement;\n}" + "value": "export interface FunctionSettingsProps\n extends Pick {}" } }, - "TableHeaderRowSlots": { + "FunctionSettingsJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "TableHeaderRowSlots", - "description": "The table header row component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "FunctionSettingsJSXProps", + "description": "The JSX props for the function settings component. These properties extend `FunctionSettingsProps` with event callbacks for form submission, reset, and error handling in JSX rendering.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The column headers displayed in the table header row.\n\nAccepts table header components, with each header defining a column and providing its label.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true - } - ], - "value": "export interface TableHeaderRowSlots {\n /**\n * The column headers displayed in the table header row.\n *\n * Accepts table header components, with each header defining a column and providing its label.\n */\n children?: HTMLElement;\n}" - } - }, - "TableRowSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TableRowSlots", - "description": "The table row component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The data cells displayed in this table row.\n\nAccepts table cell components, with each cell containing a data value for the corresponding column.", + "name": "onError", + "value": "(event: AggregateErrorEvent) => void", + "description": "An optional callback function that will be run by the admin when committing the changes to Shopify’s servers fails. The error event you receive includes an `error` property that is an `AggregateError` object. This object includes an array of errors that were caused by data your extension provided. Network errors and user errors that are out of your control will not be reported here.\n\nIn the `onError` callback, you should update your extension’s UI to highlight the fields that caused the errors, and display the error messages to the user.", "isOptional": true - } - ], - "value": "export interface TableRowSlots {\n /**\n * The data cells displayed in this table row.\n *\n * Accepts table cell components, with each cell containing a data value for the corresponding column.\n */\n children?: HTMLElement;\n}" - } - }, - "TextSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TextSlots", - "description": "The text component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The text content displayed within the text component, which applies semantic meaning and styling appropriate to the specified text type.", + "name": "onReset", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's invoked when the function settings form is reset, restoring all form fields to their initial values.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onSubmit", + "value": "((event: CallbackExtendableEvent) => void) | null", + "description": "An optional callback function that'll be run by the admin when the user commits their changes in the admin-rendered part of the function settings experience. If `event.waitUntil` is called with a promise, the admin will wait for the promise to resolve before committing any changes to Shopify’s servers. If the promise rejects, the admin will abort the changes and display an error, using the `message` property of the error you reject with.", "isOptional": true } ], - "value": "export interface TextSlots {\n /**\n * The text content displayed within the text component, which applies semantic meaning and styling appropriate to the specified text type.\n */\n children?: HTMLElement;\n}" + "value": "export interface FunctionSettingsJSXProps\n extends Partial<\n FunctionSettingsProps & Pick\n > {\n /**\n * An optional callback function that'll be run by the admin when the user\n * commits their changes in the admin-rendered part of the function settings\n * experience. If `event.waitUntil` is called with a promise, the admin will wait for the\n * promise to resolve before committing any changes to Shopify’s servers. If\n * the promise rejects, the admin will abort the changes and display an error,\n * using the `message` property of the error you reject with.\n */\n onSubmit?: ((event: CallbackExtendableEvent) => void) | null;\n /**\n * A callback that's invoked when the function settings form is reset, restoring all form fields to their initial values.\n */\n onReset?: ((event: CallbackEvent) => void) | null;\n}" } }, - "TextAreaEvents": { + "AggregateErrorEvent": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "TextAreaEvents", - "description": "The text area component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "name": "AggregateErrorEvent", + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text area loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "AT_TARGET", + "value": "2", + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text area value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "bubbles", + "value": "boolean", + "description": "The **`bubbles`** read-only property of the Event interface indicates whether the event bubbles up through the DOM tree or not.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/bubbles)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text area receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "BUBBLING_PHASE", + "value": "3", + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the text area.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface TextAreaEvents {\n /**\n * A callback fired when the text area value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the text area.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the text area loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the text area receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" - } - }, - "TextFieldEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TextFieldEvents", - "description": "The text field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "cancelable", + "value": "boolean", + "description": "The **`cancelable`** read-only property of the Event interface indicates whether the event can be canceled, and therefore prevented as if the event never happened.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelable)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "cancelBubble", + "value": "boolean", + "description": "The **`cancelBubble`** property of the Event interface is deprecated.", + "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelBubble)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "CAPTURING_PHASE", + "value": "1", + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "colno", + "value": "number", + "description": "The **`colno`** read-only property of the ErrorEvent interface returns an integer containing the column number of the script file on which the error occurred.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/colno)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the text field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface TextFieldEvents {\n /**\n * A callback fired when the text field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the text field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the text field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the text field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" - } - }, - "TextFieldSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TextFieldSlots", - "description": "The text field component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "composed", + "value": "boolean", + "description": "The read-only **`composed`** property of the or not the event will propagate across the shadow DOM boundary into the standard DOM.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composed)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "composedPath", + "value": "() => EventTarget[]", + "description": "The **`composedPath()`** method of the Event interface returns the event's path which is an array of the objects on which listeners will be invoked.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composedPath)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessory", - "value": "HTMLElement", - "description": "Additional interactive content displayed within the text field.\n\nAccepts button and clickable components with text content only. Other component types or complex layouts are not supported.", - "isOptional": true - } - ], - "value": "export interface TextFieldSlots {\n /**\n * Additional interactive content displayed within the text field.\n *\n * Accepts button and clickable components with text content only. Other component types or complex layouts are not supported.\n */\n accessory?: HTMLElement;\n}" - } - }, - "ThumbnailEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ThumbnailEvents", - "description": "The thumbnail component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "currentTarget", + "value": "EventTarget | null", + "description": "The **`currentTarget`** read-only property of the Event interface identifies the element to which the event handler has been attached.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/currentTarget)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultPrevented", + "value": "boolean", + "description": "The **`defaultPrevented`** read-only property of the Event interface returns a boolean value indicating whether or not the call to Event.preventDefault() canceled the event.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/defaultPrevented)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "error", - "value": "OnErrorEventHandler", - "description": "A callback fired when the thumbnail image fails to load.\n\nLearn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event)." + "value": "AggregateError$1", + "description": "The **`error`** read-only property of the ErrorEvent interface returns a JavaScript value, such as an Error or DOMException, representing the error associated with this event.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/error)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "load", - "value": "CallbackEventListener | null", - "description": "A callback fired when the thumbnail image successfully loads.\n\nLearn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event)." - } - ], - "value": "export interface ThumbnailEvents {\n /**\n * A callback fired when the thumbnail image successfully loads.\n *\n * Learn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback fired when the thumbnail image fails to load.\n *\n * Learn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).\n */\n error: OnErrorEventHandler = null;\n}" - } - }, - "TooltipSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TooltipSlots", - "description": "The tooltip component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "eventPhase", + "value": "number", + "description": "The **`eventPhase`** read-only property of the being evaluated.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/eventPhase)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The informational text or elements displayed within the tooltip overlay, providing helpful context or explanations when users interact with the associated element.\n\nOnly accepts text, paragraph components, and raw `textContent`.", - "isOptional": true - } - ], - "value": "export interface TooltipSlots {\n /**\n * The informational text or elements displayed within the tooltip overlay, providing helpful context or explanations when users interact with the associated element.\n *\n * Only accepts text, paragraph components, and raw `textContent`.\n */\n children?: HTMLElement;\n}" - } - }, - "URLFieldEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "URLFieldEvents", - "description": "The URL field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "filename", + "value": "string", + "description": "The **`filename`** read-only property of the ErrorEvent interface returns a string containing the name of the script file in which the error occurred.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/filename)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "initEvent", + "value": "(type: string, bubbles?: boolean, cancelable?: boolean) => void", + "description": "The **`Event.initEvent()`** method is used to initialize the value of an event created using Document.createEvent().", + "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/initEvent)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the URL field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "isTrusted", + "value": "boolean", + "description": "The **`isTrusted`** read-only property of the when the event was generated by the user agent (including via user actions and programmatic methods such as HTMLElement.focus()), and `false` when the event was dispatched via The only exception is the `click` event, which initializes the `isTrusted` property to `false` in user agents.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/isTrusted)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the URL field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "lineno", + "value": "number", + "description": "The **`lineno`** read-only property of the ErrorEvent interface returns an integer containing the line number of the script file on which the error occurred.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/lineno)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the URL field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "message", + "value": "string", + "description": "The **`message`** read-only property of the ErrorEvent interface returns a string containing a human-readable error message describing the problem.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/message)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the URL field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface URLFieldEvents {\n /**\n * A callback fired when the URL field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the URL field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the URL field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the URL field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" - } - }, - "UnorderedListSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "UnorderedListSlots", - "description": "The unordered list component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "NONE", + "value": "0", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "preventDefault", + "value": "() => void", + "description": "The **`preventDefault()`** method of the Event interface tells the user agent that if the event does not get explicitly handled, its default action should not be taken as it normally would be.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/preventDefault)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The list entries displayed within the unordered list, where each item is marked with a bullet point. Only accepts list item components as children. Each list item represents a single bulleted entry in the list.", - "isOptional": true - } - ], - "value": "export interface UnorderedListSlots {\n /**\n * The list entries displayed within the unordered list, where each item is marked with a bullet point. Only accepts list item components as children. Each list item represents a single bulleted entry in the list.\n */\n children?: HTMLElement;\n}" - } - }, - "AdminActionSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AdminActionSlots", - "description": "The admin action component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "returnValue", + "value": "boolean", + "description": "The Event property **`returnValue`** indicates whether the default action for this event has been prevented or not.", + "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/returnValue)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "primary-action", - "value": "HTMLElement", - "description": "The main action button or link displayed in the admin action modal. This represents the primary or most important action that users can take in this modal context, typically displayed with high visual prominence." + "name": "srcElement", + "value": "EventTarget | null", + "description": "The deprecated **`Event.srcElement`** is an alias for the Event.target property.", + "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/srcElement)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "stopImmediatePropagation", + "value": "() => void", + "description": "The **`stopImmediatePropagation()`** method of the If several listeners are attached to the same element for the same event type, they are called in the order in which they were added.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopImmediatePropagation)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "stopPropagation", + "value": "() => void", + "description": "The **`stopPropagation()`** method of the Event interface prevents further propagation of the current event in the capturing and bubbling phases.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopPropagation)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondary-actions", - "value": "HTMLElement", - "description": "Additional action buttons or links displayed in the admin action modal. These provide alternative or supporting actions, visually de-emphasized compared to the primary action to establish clear hierarchy." - } - ], - "value": "export interface AdminActionSlots {\n /**\n * The main action button or link displayed in the admin action modal.\n * This represents the primary or most important action that users can take in this modal context, typically displayed with high visual prominence.\n */\n 'primary-action': HTMLElement;\n /**\n * Additional action buttons or links displayed in the admin action modal.\n * These provide alternative or supporting actions, visually de-emphasized compared to the primary action to establish clear hierarchy.\n */\n 'secondary-actions': HTMLElement;\n}" - } - }, - "FormEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "FormEvents", - "description": "The form component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "target", + "value": "EventTarget | null", + "description": "The read-only **`target`** property of the dispatched.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/target)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "reset", - "value": "CallbackEventListener | null", - "description": "A callback that is run when the form is reset." + "name": "timeStamp", + "value": "DOMHighResTimeStamp", + "description": "The **`timeStamp`** read-only property of the Event interface returns the time (in milliseconds) at which the event was created.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/timeStamp)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "submit", - "value": "CallbackExtendableEventListener | null", - "description": "A callback that is run when the form is submitted." + "name": "type", + "value": "string", + "description": "The **`type`** read-only property of the Event interface returns a string containing the event's type.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/type)" } ], - "value": "export interface FormEvents {\n /**\n * A callback that is run when the form is submitted.\n */\n submit: CallbackExtendableEventListener | null = null;\n /**\n * A callback that is run when the form is reset.\n */\n reset: CallbackEventListener | null = null;\n}" + "value": "export interface AggregateErrorEvent extends ErrorEvent {\n error: AggregateError$1;\n}" } }, - "FunctionSettingsEvents": { + "FunctionSettingsError": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "FunctionSettingsEvents", - "description": "The function settings component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "name": "FunctionSettingsError", + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", - "value": "CallbackErrorEventListener<\n typeof tagName,\n FunctionSettingsErrorEvent['error']['errors'][0]\n > | null", - "description": "An optional callback function that will be run by the admin when committing the changes to Shopify’s servers fails. The error event you receive includes an `error` property that is an `AggregateError` object. This object includes an array of errors that were caused by data your extension provided. Network errors and user errors that are out of your control will not be reported here.\n\nIn the `onError` callback, you should update your extension’s UI to highlight the fields that caused the errors, and display the error messages to the user." + "name": "code", + "value": "string", + "description": "A unique identifier describing the “class” of error. These will match the GraphQL error codes as closely as possible. For example the enums returned by the `metafieldsSet` mutation" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "message", + "value": "string", + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "reset", - "value": "CallbackEventListener | null", - "description": "A callback that is run when the function settings form is reset." + "name": "name", + "value": "'FunctionSettingsError'", + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "submit", - "value": "CallbackExtendableEventListener | null", - "description": "An optional callback function that will be run by the admin when the user commits their changes in the admin-rendered part of the function settings experience. If `event.waitUntil` is called with a promise, the admin will wait for the promise to resolve before committing any changes to Shopify’s servers. If the promise rejects, the admin will abort the changes and display an error, using the `message` property of the error you reject with." + "name": "stack", + "value": "string", + "description": "", + "isOptional": true } ], - "value": "export interface FunctionSettingsEvents {\n /**\n * An optional callback function that will be run by the admin when the user\n * commits their changes in the admin-rendered part of the function settings\n * experience. If `event.waitUntil` is called with a promise, the admin will wait for the\n * promise to resolve before committing any changes to Shopify’s servers. If\n * the promise rejects, the admin will abort the changes and display an error,\n * using the `message` property of the error you reject with.\n */\n submit: CallbackExtendableEventListener | null = null;\n /**\n * An optional callback function that will be run by the admin when\n * committing the changes to Shopify’s servers fails. The error event you receive includes\n * an `error` property that is an `AggregateError` object. This object includes\n * an array of errors that were caused by data your extension provided.\n * Network errors and user errors that are out of your control will not be reported here.\n *\n * In the `onError` callback, you should update your extension’s UI to\n * highlight the fields that caused the errors, and display the error messages\n * to the user.\n */\n error: CallbackErrorEventListener<\n typeof tagName,\n FunctionSettingsErrorEvent['error']['errors'][0]\n > | null = null;\n /**\n * A callback that is run when the function settings form is reset.\n */\n reset: CallbackEventListener | null = null;\n}" + "value": "export interface FunctionSettingsError extends Error {\n /**\n * A unique identifier describing the “class” of error. These will match\n * the GraphQL error codes as closely as possible. For example the enums\n * returned by the `metafieldsSet` mutation\n *\n * @see https://shopify.dev/docs/api/admin-graphql/latest/enums/MetafieldsSetUserErrorCode\n */\n code: string;\n name: 'FunctionSettingsError';\n}" } }, "DataGeneratedType": { diff --git a/packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04-rc/targets.json b/packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04/targets.json similarity index 98% rename from packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04-rc/targets.json rename to packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04/targets.json index e2f71779fa..a71fa8f202 100644 --- a/packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04-rc/targets.json +++ b/packages/ui-extensions/docs/surfaces/admin/generated/admin_extensions/2026-04/targets.json @@ -2930,6 +2930,68 @@ "ValidationSettingsApi" ] }, + "admin.app.intent.render": { + "components": [ + "Avatar", + "Badge", + "Banner", + "Box", + "Button", + "ButtonGroup", + "Checkbox", + "Chip", + "Choice", + "ChoiceList", + "Clickable", + "ClickableChip", + "ColorField", + "ColorPicker", + "DateField", + "DatePicker", + "Divider", + "DropZone", + "EmailField", + "Form", + "Grid", + "GridItem", + "Heading", + "Icon", + "Image", + "Link", + "ListItem", + "Menu", + "MoneyField", + "NumberField", + "Option", + "OptionGroup", + "OrderedList", + "Paragraph", + "PasswordField", + "QueryContainer", + "SearchField", + "Section", + "Select", + "Spinner", + "Stack", + "Switch", + "Table", + "TableBody", + "TableCell", + "TableHeader", + "TableHeaderRow", + "TableRow", + "Text", + "TextArea", + "TextField", + "Thumbnail", + "Tooltip", + "URLField", + "UnorderedList" + ], + "apis": [ + "IntentRenderApi" + ] + }, "admin.customers.segmentation-templates.data": { "components": [], "apis": [ @@ -3193,6 +3255,11 @@ "admin.settings.validation.render" ] }, + "IntentRenderApi": { + "targets": [ + "admin.app.intent.render" + ] + }, "CustomerSegmentTemplateApi": { "targets": [ "admin.customers.segmentation-templates.data" @@ -3257,6 +3324,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -3308,6 +3376,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -3359,6 +3428,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -3410,6 +3480,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -3461,6 +3532,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -3512,6 +3584,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -3563,6 +3636,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -3614,6 +3688,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -3665,6 +3740,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -3716,6 +3792,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -3767,6 +3844,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -3818,6 +3896,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -3869,6 +3948,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -3920,6 +4000,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -3971,6 +4052,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4022,6 +4104,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4073,6 +4156,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4124,6 +4208,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4175,6 +4260,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4225,6 +4311,7 @@ "Form": { "targets": [ "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.block.render", "admin.collection-details.block.render", "admin.company-details.block.render", @@ -4247,6 +4334,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4298,6 +4386,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4349,6 +4438,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4400,6 +4490,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4451,6 +4542,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4502,6 +4594,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4553,6 +4646,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4604,6 +4698,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4655,6 +4750,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4706,6 +4802,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4757,6 +4854,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4808,6 +4906,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4859,6 +4958,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4910,6 +5010,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -4961,6 +5062,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5012,6 +5114,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5063,6 +5166,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5114,6 +5218,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5165,6 +5270,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5216,6 +5322,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5267,6 +5374,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5318,6 +5426,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5369,6 +5478,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5420,6 +5530,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5471,6 +5582,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5522,6 +5634,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5573,6 +5686,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5624,6 +5738,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5675,6 +5790,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5726,6 +5842,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5777,6 +5894,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5828,6 +5946,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5879,6 +5998,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5930,6 +6050,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", @@ -5981,6 +6102,7 @@ "targets": [ "admin.abandoned-checkout-details.action.render", "admin.abandoned-checkout-details.block.render", + "admin.app.intent.render", "admin.catalog-details.action.render", "admin.catalog-details.block.render", "admin.collection-details.action.render", diff --git a/packages/ui-extensions/docs/surfaces/admin/generated/app_home/generated_docs_data.json b/packages/ui-extensions/docs/surfaces/admin/generated/app_home/generated_docs_data.json index a6e53b4b60..ed925dbc46 100644 --- a/packages/ui-extensions/docs/surfaces/admin/generated/app_home/generated_docs_data.json +++ b/packages/ui-extensions/docs/surfaces/admin/generated/app_home/generated_docs_data.json @@ -7599,9 +7599,25 @@ "Avatar": { "filePath": "src/surfaces/admin/components.ts", "name": "Avatar", - "description": "Configure the following properties on the avatar component.", - "isPublicDocs": true, + "description": "An avatar displays a user or entity image with fallback initials when the image isn't available.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7616,7 +7632,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the avatar for accessibility.\n\nProvides a text description of the avatar for users with assistive technology and serves as a fallback when the avatar fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an avatar, it reads this description aloud. When an avatar fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", + "description": "Alternative text that describes the avatar for screen readers.", "isOptional": true }, { @@ -7633,7 +7649,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -7660,7 +7676,7 @@ "syntaxKind": "PropertyDeclaration", "name": "initials", "value": "string", - "description": "The initials to display in the avatar when no image is provided or fails to load. Typically one or two characters representing a person's first and last name initials, such as \"JD\" for John Doe.", + "description": "The initials to display when no image is provided or if the image fails to load.", "isOptional": true }, { @@ -7668,7 +7684,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -7686,7 +7702,7 @@ "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"base\" | \"large\" | \"large-200\"", - "description": "The size of the avatar image.\n\n- `small-200`: Extra small avatar, suitable for compact displays or lists with many items.\n- `small`: Small avatar, good for secondary contexts or tight layouts.\n- `base`: Default size that works well in most contexts.\n- `large`: Large avatar for emphasis or when the avatar is a focal point.\n- `large-200`: Extra large avatar for prominent display.", + "description": "The size of the avatar.", "defaultValue": "'base'", "isOptional": true }, @@ -7695,17 +7711,24 @@ "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The URL or path to the avatar image. When provided, the image takes priority over `initials`. If the image fails to load or loads slowly, `initials` will be rendered as a fallback.", + "description": "The URL of the avatar image to display.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", "isOptional": true } ], - "value": "declare class Avatar extends PreactCustomElement implements AvatarProps {\n accessor initials: AvatarProps['initials'];\n accessor src: AvatarProps['src'];\n accessor size: AvatarProps['size'];\n accessor alt: AvatarProps['alt'];\n constructor();\n}" + "value": "declare class Avatar extends PolarisCustomElement implements AvatarProps {\n /**\n * The initials to display when no image is provided or if the image fails to load.\n */\n initials: AvatarProps['initials'];\n /**\n * The URL of the avatar image to display.\n */\n src: AvatarProps['src'];\n /**\n * The size of the avatar.\n */\n size: AvatarProps['size'];\n /**\n * Alternative text that describes the avatar for screen readers.\n */\n alt: AvatarProps['alt'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -7728,7 +7751,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -7736,7 +7759,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -7744,7 +7767,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -7752,11 +7775,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -7768,15 +7791,14 @@ "AvatarEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "AvatarEvents", - "description": "The avatar component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "error", "value": "OnErrorEventHandler", - "description": "A callback fired when the avatar image fails to load.\n\nLearn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).", + "description": "A callback that's fired when the avatar image fails to load.", "isOptional": true }, { @@ -7784,27 +7806,25 @@ "syntaxKind": "PropertySignature", "name": "load", "value": "CallbackEventListener | null", - "description": "A callback fired when the avatar image successfully loads.\n\nLearn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).", + "description": "A callback that's fired when the avatar image has loaded successfully.", "isOptional": true } ], - "value": "export interface AvatarEvents {\n /**\n * A callback fired when the avatar image successfully loads.\n *\n * Learn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback fired when the avatar image fails to load.\n *\n * Learn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).\n */\n error: OnErrorEventHandler = null;\n}" + "value": "export interface AvatarEvents {\n /**\n * A callback that's fired when the avatar image has loaded successfully.\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback that's fired when the avatar image fails to load.\n */\n error: OnErrorEventHandler = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -7989,9 +8009,25 @@ "Badge": { "filePath": "src/surfaces/admin/components.ts", "name": "Badge", - "description": "Configure the following properties on the badge component.", - "isPublicDocs": true, + "description": "The badge custom element class that renders status indicators in the Shopify admin interface. This component displays compact visual indicators with customizable tones, sizes, and optional icons to communicate status information to merchants.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8015,7 +8051,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -8024,7 +8060,7 @@ "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"strong\"", - "description": "Controls the visual weight and emphasis of the badge.\n\n- `base`: Standard weight with moderate emphasis, suitable for most use cases.\n- `strong`: Increased visual weight for higher emphasis and prominence.", + "description": "The visual weight of the badge. Available options: `'base'` for standard weight or `'strong'` for increased emphasis.", "defaultValue": "'base'", "isOptional": true }, @@ -8050,8 +8086,9 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the badge to provide additional visual context or reinforce the badge's meaning. Accepts any icon name from the icon library or a custom string identifier.", + "value": "\"\" | IconType", + "description": "The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''", "isOptional": true }, { @@ -8059,7 +8096,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -8077,7 +8114,7 @@ "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the badge.\n\n- `base`: Default size suitable for most badge use cases.\n- `large`: Larger badge for increased visibility and prominence.\n- `large-100`: Extra large badge for maximum visibility in emphasized contexts.", + "description": "The size of the badge. Available options: `'base'` for standard size, `'large'` for larger size, or `'large-100'` for extra large size.", "defaultValue": "'base'", "isOptional": true }, @@ -8086,18 +8123,32 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", + "description": "The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.", "defaultValue": "'auto'", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Badge extends PreactCustomElement implements BadgeProps {\n accessor color: BadgeProps['color'];\n accessor icon: BadgeProps['icon'];\n accessor size: BadgeProps['size'];\n accessor tone: BadgeProps['tone'];\n constructor();\n}" + "value": "declare class Badge extends BadgeBase implements BadgeProps {\n /**\n * The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: BadgeProps['icon'];\n /**\n * The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.\n */\n tone: BadgeProps['tone'];\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -8120,7 +8171,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -8128,7 +8179,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -8136,7 +8187,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -8144,11 +8195,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -8160,19 +8211,18 @@ "BadgeSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "BadgeSlots", - "description": "The badge component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The text label displayed within the badge component, typically a short status indicator or category label.", + "description": "The text content to display inside the badge. Typically a short status label like \"Fulfilled\", \"Draft\", or \"Active\".", "isOptional": true } ], - "value": "export interface BadgeSlots {\n /**\n * The text label displayed within the badge component, typically a short status indicator or category label.\n */\n children?: HTMLElement;\n}" + "value": "export interface BadgeSlots {\n /**\n * The text content to display inside the badge. Typically a short status label like \"Fulfilled\", \"Draft\", or \"Active\".\n */\n children?: HTMLElement;\n}" } } } @@ -8289,9 +8339,25 @@ "Banner": { "filePath": "src/surfaces/admin/components.ts", "name": "Banner", - "description": "Configure the following properties on the banner component.", - "isPublicDocs": true, + "description": "A custom element for displaying important messages and notifications.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8315,7 +8381,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -8342,7 +8408,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dismissible", "value": "boolean", - "description": "Whether the banner displays a close button that allows users to dismiss it.\n\nWhen the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, any animation completes, and the `afterhide` event fires.", + "description": "Whether the banner can be dismissed by the user.", "defaultValue": "false", "isOptional": true }, @@ -8360,7 +8426,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Controls whether the banner is visible or hidden.\n\nWhen using a controlled component pattern and the banner is `dismissible`, update this property to `true` when the `dismiss` event fires.\n\nYou can hide the banner programmatically by setting this to `true` even if it's not `dismissible`.", + "description": "Whether the banner is hidden from view.", "defaultValue": "false", "isOptional": true }, @@ -8369,7 +8435,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -8387,18 +8453,25 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.", + "description": "The color tone of the banner based on its semantic meaning.", "defaultValue": "'auto'", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Banner extends PreactCustomElement implements BannerProps {\n accessor heading: BannerProps['heading'];\n accessor tone: BannerProps['tone'];\n accessor hidden: BannerProps['hidden'];\n accessor dismissible: BannerProps['dismissible'];\n constructor();\n}" + "value": "declare class Banner extends PolarisCustomElement implements BannerProps {\n /**\n * The heading text displayed at the top of the banner.\n */\n heading: BannerProps['heading'];\n /**\n * The color tone of the banner based on its semantic meaning.\n */\n tone: BannerProps['tone'];\n /**\n * Whether the banner is hidden from view.\n */\n hidden: BannerProps['hidden'];\n /**\n * Whether the banner can be dismissed by the user.\n */\n dismissible: BannerProps['dismissible'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -8421,7 +8494,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -8429,7 +8502,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -8437,7 +8510,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -8445,11 +8518,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -8461,15 +8534,14 @@ "BannerEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "BannerEvents", - "description": "The banner component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "afterhide", "value": "CallbackEventListener | null", - "description": "A callback fired after the banner is hidden.", + "description": "A callback that's fired after the banner finishes hiding.", "isOptional": true }, { @@ -8477,27 +8549,25 @@ "syntaxKind": "PropertySignature", "name": "dismiss", "value": "CallbackEventListener | null", - "description": "A callback fired when the banner is dismissed.", + "description": "A callback that's fired when the banner is dismissed.", "isOptional": true } ], - "value": "export interface BannerEvents {\n /**\n * A callback fired when the banner is dismissed.\n */\n dismiss: CallbackEventListener | null = null;\n /**\n * A callback fired after the banner is hidden.\n */\n afterhide: CallbackEventListener | null = null;\n}" + "value": "export interface BannerEvents {\n /**\n * A callback that's fired when the banner is dismissed.\n */\n dismiss: CallbackEventListener | null = null;\n /**\n * A callback that's fired after the banner finishes hiding.\n */\n afterhide: CallbackEventListener | null = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -8509,15 +8579,14 @@ "BannerSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "BannerSlots", - "description": "The banner component supports slots for additional content placement within the banner. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The main message content displayed within the banner component, providing important information or guidance to users.", + "description": "The content of the banner.", "isOptional": true }, { @@ -8525,11 +8594,11 @@ "syntaxKind": "PropertySignature", "name": "secondary-actions", "value": "HTMLElement", - "description": "Action buttons displayed at the bottom of the banner that let users respond to the message. Accepts up to two button components with `variant=\"secondary\"` or `variant=\"auto\"`.", + "description": "The secondary actions to display at the bottom of the banner. Only buttons with the `variant` of `'secondary'` or `'auto'` are allowed. A maximum of two `s-button` components can be provided.", "isOptional": true } ], - "value": "export interface BannerSlots {\n /**\n * The main message content displayed within the banner component, providing important information or guidance to users.\n */\n children?: HTMLElement;\n /**\n * Action buttons displayed at the bottom of the banner that let users respond to the message.\n * Accepts up to two button components with `variant=\"secondary\"` or `variant=\"auto\"`.\n */\n 'secondary-actions'?: HTMLElement;\n}" + "value": "export interface BannerSlots {\n /**\n * The content of the banner.\n */\n children?: HTMLElement;\n /**\n * The secondary actions to display at the bottom of the banner. Only buttons with the `variant` of `'secondary'` or `'auto'` are allowed. A maximum of two `s-button` components can be provided.\n */\n 'secondary-actions'?: HTMLElement;\n}" } } } @@ -8640,15 +8709,31 @@ "Box": { "filePath": "src/surfaces/admin/components.ts", "name": "Box", - "description": "Configure the following properties on the box component.", - "isPublicDocs": true, + "description": "A box is a container component that provides control over layout, spacing, and styling.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { @@ -8656,7 +8741,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'", "isOptional": true }, @@ -8665,7 +8750,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -8692,7 +8777,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'", "isOptional": true }, @@ -8701,7 +8786,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'", "isOptional": true }, @@ -8710,7 +8795,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -8731,7 +8816,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -8740,7 +8825,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'", "isOptional": true }, @@ -8749,7 +8834,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -8758,7 +8843,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -8767,7 +8852,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -8794,7 +8879,7 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'", "isOptional": true }, @@ -8803,7 +8888,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'", "isOptional": true }, @@ -8812,7 +8897,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -8821,7 +8906,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -8830,7 +8915,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -8839,7 +8924,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -8848,7 +8933,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'", "isOptional": true }, @@ -8857,7 +8942,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'", "isOptional": true }, @@ -8866,7 +8951,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -8875,7 +8960,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -8884,7 +8969,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -8893,7 +8978,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -8902,7 +8987,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -8911,7 +8996,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -8920,7 +9005,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -8932,6 +9017,14 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], "value": "declare class Box extends BoxElement implements BoxProps {\n constructor();\n}" @@ -8940,120 +9033,106 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -9061,14 +9140,13 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -9091,7 +9169,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -9099,7 +9177,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -9107,7 +9185,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -9115,11 +9193,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -9131,19 +9209,18 @@ "BoxSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "BoxSlots", - "description": "The box component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The content displayed within the box component, which serves as a flexible container for organizing and styling other components.", + "description": "The child elements to render inside the box.", "isOptional": true } ], - "value": "export interface BoxSlots {\n /**\n * The content displayed within the box component, which serves as a flexible container for organizing and styling other components.\n */\n children?: HTMLElement;\n}" + "value": "export interface BoxSlots {\n /**\n * The child elements to render inside the box.\n */\n children?: HTMLElement;\n}" } } } @@ -9277,15 +9354,31 @@ "Button": { "filePath": "src/surfaces/admin/components.ts", "name": "Button", - "description": "Configure the following properties on the button component.", - "isPublicDocs": true, + "description": "The button custom element class that renders interactive buttons in the Shopify admin interface. This component triggers actions or navigation when clicked, with customizable visual styles, states, and optional icons.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A text description of the button's purpose for screen readers. This is essential for accessibility when the button doesn't have visible text.", "isOptional": true }, { @@ -9311,7 +9404,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -9320,7 +9413,7 @@ "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'", "isOptional": true }, @@ -9329,7 +9422,7 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated.", + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated.", "isOptional": true }, { @@ -9346,7 +9439,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", + "description": "Whether the button is disabled, preventing any interaction. When `true`, the button appears visually disabled and doesn't respond to user clicks.", "defaultValue": "false", "isOptional": true }, @@ -9364,7 +9457,7 @@ "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", + "description": "Prompts the user to save the linked URL as a file with the specified filename. Only works when `href` is provided.", "isOptional": true }, { @@ -9372,15 +9465,25 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", + "description": "A URL that the button should navigate to when clicked. When provided, the button behaves as a link.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier.", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "inlineSize", + "value": "\"auto\" | \"fill\" | \"fit-content\"", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", + "defaultValue": "'auto'", "isOptional": true }, { @@ -9388,7 +9491,7 @@ "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated.", "isOptional": true }, { @@ -9396,7 +9499,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", + "description": "Whether the button is in a loading state. When `true`, displays a loading indicator and prevents interaction to show that an action is in progress.", "defaultValue": "false", "isOptional": true }, @@ -9405,7 +9508,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -9423,7 +9526,7 @@ "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to open the linked document when the button acts as a link. Available options: `''`, `'_blank'`, `'_self'`, `'_parent'`, or `'_top'`.", "defaultValue": "'auto'", "isOptional": true }, @@ -9432,7 +9535,7 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", + "description": "The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.", "defaultValue": "'auto'", "isOptional": true }, @@ -9441,35 +9544,48 @@ "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The button's behavior in forms. Available options: `'button'`, `'submit'`, or `'reset'`.", "defaultValue": "'button'", "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "variant", "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "defaultValue": "'auto'", + "description": "The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.", + "defaultValue": "'auto' - the variant is automatically determined by the Button's context", "isOptional": true } ], - "value": "declare class Button extends Button_base implements ButtonProps {\n accessor disabled: ButtonProps['disabled'];\n accessor icon: ButtonProps['icon'];\n accessor loading: ButtonProps['loading'];\n accessor variant: ButtonProps['variant'];\n accessor tone: ButtonProps['tone'];\n accessor target: ButtonProps['target'];\n accessor href: ButtonProps['href'];\n accessor download: ButtonProps['download'];\n accessor type: ButtonProps['type'];\n accessor accessibilityLabel: ButtonProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Button\n extends ButtonBase\n implements ButtonProps\n{\n /**\n * The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: ButtonProps['icon'];\n /**\n * The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.\n */\n variant: ButtonProps['variant'];\n /**\n * The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.\n */\n tone: ButtonProps['tone'];\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "AnyString": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AnyString", "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true + "description": "Prevents widening string literal types in a union to `string`." }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -9492,7 +9608,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -9500,7 +9616,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -9508,7 +9624,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -9516,11 +9632,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -9532,51 +9648,48 @@ "ButtonEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ButtonEvents", - "description": "The button component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", - "value": "CallbackEventListener | null", - "description": "A callback fired when the button loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "value": "CallbackEventListener | null", + "description": "A callback that's invoked when the button loses focus. Receives the blur event as an argument.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "click", - "value": "CallbackEventListener | null", - "description": "A callback fired when the button is clicked.\n\nLearn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", + "value": "CallbackEventListener | null", + "description": "A callback that's invoked when the button is clicked. Receives the click event as an argument.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "focus", - "value": "CallbackEventListener | null", - "description": "A callback fired when the button receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "value": "CallbackEventListener | null", + "description": "A callback that's invoked when the button receives focus. Receives the focus event as an argument.", "isOptional": true } ], - "value": "export interface ButtonEvents {\n /**\n * A callback fired when the button is clicked.\n *\n * Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n click: CallbackEventListener | null = null;\n /**\n * A callback fired when the button loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener | null = null;\n /**\n * A callback fired when the button receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener | null = null;\n}" + "value": "export interface ButtonEvents {\n /**\n * A callback that's invoked when the button is clicked. Receives the click event as an argument.\n */\n click: CallbackEventListener | null;\n /**\n * A callback that's invoked when the button loses focus. Receives the blur event as an argument.\n */\n blur: CallbackEventListener | null;\n /**\n * A callback that's invoked when the button receives focus. Receives the focus event as an argument.\n */\n focus: CallbackEventListener | null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -9588,19 +9701,18 @@ "ButtonSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ButtonSlots", - "description": "The button component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The label text or elements displayed inside the button component, describing the action that will be performed when clicked.", + "description": "The text label or content to display inside the button. Can be plain text or other components.", "isOptional": true } ], - "value": "export interface ButtonSlots {\n /**\n * The label text or elements displayed inside the button component, describing the action that will be performed when clicked.\n */\n children?: HTMLElement;\n}" + "value": "export interface ButtonSlots {\n /**\n * The text label or content to display inside the button. Can be plain text or other components.\n */\n children?: HTMLElement;\n}" } } } @@ -9830,15 +9942,31 @@ "ButtonGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "ButtonGroup", - "description": "Configure the following properties on the button group component.", - "isPublicDocs": true, + "description": "A button group that arranges multiple buttons together with consistent spacing and semantic grouping for related actions.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that's only visible to screen readers, describing the purpose of this group of buttons.", "isOptional": true }, { @@ -9864,7 +9992,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -9883,7 +10011,6 @@ "name": "disconnectedCallback", "value": "() => void", "description": "", - "isPrivate": true, "isOptional": true }, { @@ -9891,7 +10018,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "\"base\" | \"none\"", - "description": "The spacing between buttons in the group.\n\n- `base`: Standard spacing that provides clear visual separation between buttons.\n- `none`: No spacing, creating a connected button group.", + "description": "The amount of spacing between buttons in the group, affecting the visual separation of actions.", "defaultValue": "'base'", "isOptional": true }, @@ -9900,7 +10027,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -9912,15 +10039,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class ButtonGroup\n extends PreactCustomElement\n implements ButtonGroupProps\n{\n accessor gap: ButtonGroupProps['gap'];\n accessor accessibilityLabel: ButtonGroupProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class ButtonGroup extends ButtonGroupBase implements ButtonGroupProps {\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -9943,7 +10077,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -9951,7 +10085,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -9959,7 +10093,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -9967,11 +10101,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -9983,15 +10117,14 @@ "ButtonGroupSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ButtonGroupSlots", - "description": "The button group component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The buttons displayed within the button group component, which are arranged together as a cohesive set of related actions.", + "description": "The buttons that should be grouped together, provided as Button components.", "isOptional": true }, { @@ -9999,7 +10132,7 @@ "syntaxKind": "PropertySignature", "name": "primary-action", "value": "HTMLElement", - "description": "The main action for this group, displayed with high visual emphasis. Accepts a single button with `variant=\"primary\"`.\n\nUse this for the primary action you want users to take. This can't be used when `gap=\"none\"`.", + "description": "A single primary action button that's visually emphasized as the most important action in the group.\n\nAccepts a single Button element with a `variant` of `primary`. Can't be used when `gap` is set to `none`.", "isOptional": true }, { @@ -10007,11 +10140,11 @@ "syntaxKind": "PropertySignature", "name": "secondary-actions", "value": "HTMLElement", - "description": "Supporting actions displayed with less emphasis than the primary action. Accepts one or more button components with `variant=\"secondary\"` or `variant=\"auto\"`.\n\nUse these for alternative or less critical actions.", + "description": "One or more secondary action buttons that provide alternative or less prominent actions.\n\nAccepts Button elements with a `variant` of `secondary` or `auto`.", "isOptional": true } ], - "value": "export interface ButtonGroupSlots {\n /**\n * The buttons displayed within the button group component, which are arranged together as a cohesive set of related actions.\n */\n children?: HTMLElement;\n /**\n * The main action for this group, displayed with high visual emphasis.\n * Accepts a single button with `variant=\"primary\"`.\n *\n * Use this for the primary action you want users to take. This can't be used when `gap=\"none\"`.\n */\n 'primary-action'?: HTMLElement;\n /**\n * Supporting actions displayed with less emphasis than the primary action.\n * Accepts one or more button components with `variant=\"secondary\"` or `variant=\"auto\"`.\n *\n * Use these for alternative or less critical actions.\n */\n 'secondary-actions'?: HTMLElement;\n}" + "value": "export interface ButtonGroupSlots {\n /**\n * The buttons that should be grouped together, provided as Button components.\n */\n children?: HTMLElement;\n /**\n * A single primary action button that's visually emphasized as the most important action in the group.\n *\n * Accepts a single Button element with a `variant` of `primary`. Can't be used when `gap` is set to `none`.\n */\n 'primary-action'?: HTMLElement;\n /**\n * One or more secondary action buttons that provide alternative or less prominent actions.\n *\n * Accepts Button elements with a `variant` of `secondary` or `auto`.\n */\n 'secondary-actions'?: HTMLElement;\n}" } } } @@ -10139,24 +10272,40 @@ "Checkbox": { "filePath": "src/surfaces/admin/components.ts", "name": "Checkbox", - "description": "Configure the following properties on the checkbox component.", - "isPublicDocs": true, + "description": "A checkbox that lets users select or deselect an option, with support for an indeterminate state.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@15957", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers.", "isOptional": true }, { @@ -10182,7 +10331,7 @@ "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false", "isOptional": true }, @@ -10191,7 +10340,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -10209,7 +10358,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false", "isOptional": true }, @@ -10218,7 +10367,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultIndeterminate", "value": "boolean", - "description": "The initial indeterminate state for uncontrolled components. Use this when you want the checkbox to start in an indeterminate state but don't need to control it afterward.\n\nThis value applies until `indeterminate` is explicitly set or the user changes the checkbox state by clicking.", + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered.", "defaultValue": "false", "isOptional": true }, @@ -10226,8 +10375,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -10235,7 +10384,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -10252,8 +10401,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -10270,7 +10419,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -10278,15 +10427,24 @@ "syntaxKind": "GetAccessor", "name": "indeterminate", "value": "boolean", - "description": "Whether the checkbox displays in an indeterminate state (neither checked nor unchecked), typically used to indicate partial selection in hierarchical lists.\n\nThis visual state takes priority over the `checked` prop in appearance only. The form submission value is still determined by the `checked` prop.\n\nIf `indeterminate` has not been explicitly set and hasn't been modified by user interaction, it returns the value of `defaultIndeterminate`.", + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state.", + "value": "any", + "description": "Visual content to use as the control label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "labelAccessibilityVisibility", + "value": "\"visible\" | \"exclusive\"", + "description": "", + "defaultValue": "'visible'", "isOptional": true }, { @@ -10294,7 +10452,15 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "", "isOptional": true }, { @@ -10302,7 +10468,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -10324,6 +10490,14 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -10333,13 +10507,19 @@ "isOptional": true } ], - "value": "declare class Checkbox extends PreactCheckboxElement implements CheckboxProps {\n get indeterminate(): CheckboxProps['indeterminate'];\n set indeterminate(indeterminate: CheckboxProps['indeterminate']);\n accessor defaultIndeterminate: CheckboxProps['defaultIndeterminate'];\n constructor();\n}" + "value": "declare class Checkbox extends CheckboxBase implements CheckboxProps {\n constructor();\n}" + }, + "CallbackEvent": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CallbackEvent", + "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -10362,7 +10542,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -10370,7 +10550,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -10378,7 +10558,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -10386,11 +10566,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -10402,43 +10582,48 @@ "CheckboxEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "CheckboxEvents", - "description": "The checkbox component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", + "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the checkbox value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", + "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the checkbox.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true - } + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "input", + "value": "CallbackEventListener<'input'>", + "description": "", + "isOptional": true + } ], - "value": "export interface CheckboxEvents {\n /**\n * A callback fired when the checkbox value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the checkbox.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n}" + "value": "export interface CheckboxEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -10594,15 +10779,31 @@ "Chip": { "filePath": "src/surfaces/admin/components.ts", "name": "Chip", - "description": "Configure the following properties on the chip component.", - "isPublicDocs": true, + "description": "", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers.", "isOptional": true }, { @@ -10628,7 +10829,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -10637,7 +10838,7 @@ "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "Modify the color to be more or less intense.", "defaultValue": "'base'", "isOptional": true }, @@ -10664,10 +10865,19 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", + "defaultValue": "false", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -10676,23 +10886,29 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Chip extends PreactCustomElement implements ChipProps {\n accessor color: ChipProps['color'];\n accessor accessibilityLabel: ChipProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Chip extends PolarisCustomElement implements ChipProps {\n color: ChipProps['color'];\n accessibilityLabel: ChipProps['accessibilityLabel'];\n removable: ChipProps['removable'];\n constructor(renderImpl?: Omit);\n}" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -10715,7 +10931,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -10723,7 +10939,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -10731,7 +10947,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -10739,11 +10955,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -10755,15 +10971,14 @@ "ChipSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ChipSlots", - "description": "The chip component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The text label displayed within the chip component, typically representing a selected filter, tag, or removable item.", + "description": "The content of the chip.", "isOptional": true }, { @@ -10771,11 +10986,11 @@ "syntaxKind": "PropertySignature", "name": "graphic", "value": "HTMLElement", - "description": "An optional icon to display at the start of the chip. Accepts only icon components.", + "description": "An optional icon to display at the start of the chip. Accepts only Icon components.", "isOptional": true } ], - "value": "export interface ChipSlots {\n /**\n * The text label displayed within the chip component, typically representing a selected filter, tag, or removable item.\n */\n children?: HTMLElement;\n /**\n * An optional icon to display at the start of the chip. Accepts only icon components.\n */\n graphic?: HTMLElement;\n}" + "value": "export interface ChipSlots {\n /**\n * The content of the chip.\n */\n children?: HTMLElement;\n /**\n * An optional icon to display at the start of the chip. Accepts only Icon components.\n */\n graphic?: HTMLElement;\n}" } } } @@ -10892,18 +11107,43 @@ "ChoiceList": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceList", - "description": "Configure the following properties on the choice list component.", - "isPublicDocs": true, + "description": "A list of choices that lets users select one or more options using radio buttons or checkboxes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$3@16010", + "name": "__@internals$3@16769", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "addEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", + "description": "Wraps change and input event listeners so they only fire when the event was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n\nThis prevents form events from elements inside secondary content (e.g. TextField, native ) from being mistakenly treated as ChoiceList value-change events, while still allowing those events to bubble normally through the DOM (preserving React's event delegation).", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -10927,7 +11167,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -10944,8 +11184,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the choice list.", "isOptional": true }, { @@ -10953,7 +11193,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction. When `true`, the `disabled` property on any child choices is ignored.", + "description": "Whether all choices in the list are disabled and can't be selected.", "defaultValue": "false", "isOptional": true }, @@ -10970,8 +11210,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "An error message that's displayed below the choice list when validation fails.", "isOptional": true }, { @@ -10987,8 +11227,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "The text that describes what the choice list is for.", "isOptional": true }, { @@ -10996,7 +11236,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'", "isOptional": true }, @@ -11005,7 +11245,7 @@ "syntaxKind": "PropertyDeclaration", "name": "multiple", "value": "boolean", - "description": "Whether multiple choices can be selected.", + "description": "Whether users can select more than one choice at a time.", "defaultValue": "false", "isOptional": true }, @@ -11014,7 +11254,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "The name that identifies this choice list when the form is submitted.", "isOptional": true }, { @@ -11022,7 +11262,16 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "removeEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", + "description": "", "isPrivate": true, "isOptional": true }, @@ -11035,22 +11284,29 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "values", "value": "string[]", - "description": "An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected.", + "description": "The values of the currently selected choices.", "isOptional": true } ], - "value": "declare class ChoiceList extends BaseClass$3 implements ChoiceListProps {\n accessor disabled: ChoiceListProps['disabled'];\n accessor name: ChoiceListProps['name'];\n accessor error: ChoiceListProps['error'];\n accessor details: ChoiceListProps['details'];\n accessor multiple: ChoiceListProps['multiple'];\n accessor label: ChoiceListProps['label'];\n accessor labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class ChoiceList extends BaseClass$1 implements ChoiceListProps {\n /**\n * Wraps change and input event listeners so they only fire when the event\n * was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n *\n * This prevents form events from elements inside secondary content (e.g.\n * TextField, native ) from being mistakenly treated as ChoiceList\n * value-change events, while still allowing those events to bubble normally\n * through the DOM (preserving React's event delegation).\n * @private\n */\n addEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n\n /** @private */\n removeEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: EventListenerOptions | boolean,\n ): void;\n\n /**\n * Whether all choices in the list are disabled and can't be selected.\n */\n disabled: ChoiceListProps['disabled'];\n /**\n * The name that identifies this choice list when the form is submitted.\n */\n name: ChoiceListProps['name'];\n /**\n * An error message that's displayed below the choice list when validation fails.\n */\n error: ChoiceListProps['error'];\n /**\n * Additional text to provide context or guidance for the choice list.\n */\n details: ChoiceListProps['details'];\n /**\n * Whether users can select more than one choice at a time.\n */\n multiple: ChoiceListProps['multiple'];\n /**\n * The text that describes what the choice list is for.\n */\n label: ChoiceListProps['label'];\n /**\n * Controls whether the label is visible to all users or only to screen readers.\n */\n labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n /**\n * The values of the currently selected choices.\n */\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -11073,7 +11329,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -11081,7 +11337,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -11089,7 +11345,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -11097,11 +11353,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -11113,15 +11369,14 @@ "ChoiceListEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceListEvents", - "description": "The choice list component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener | null", - "description": "A callback fired when the choice list selection changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "A callback that's triggered when the selected choices change and the choice list loses focus.", "isOptional": true }, { @@ -11129,27 +11384,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener | null", - "description": "A callback fired when the user inputs data into the choice list.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "A callback that's triggered when the selected choices change.", "isOptional": true } ], - "value": "export interface ChoiceListEvents {\n /**\n * A callback fired when the choice list selection changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener | null = null;\n /**\n * A callback fired when the user inputs data into the choice list.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener | null = null;\n}" + "value": "export interface ChoiceListEvents {\n /**\n * A callback that's triggered when the selected choices change and the choice list loses focus.\n */\n change: CallbackEventListener | null = null;\n /**\n * A callback that's triggered when the selected choices change.\n */\n input: CallbackEventListener | null = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -11161,15 +11414,31 @@ "Choice": { "filePath": "src/surfaces/admin/components.ts", "name": "Choice", - "description": "The choice component creates individual selectable options within a choice list. Use choice to define each option that merchants can select, supporting both single selection (radio buttons) and multiple selection (checkboxes) modes.\n\nChoice components support labels, help text, and custom content through slots, providing flexible option presentation within choice lists.", - "isPublicDocs": true, + "description": "A single choice within a choice list that can be selected with a radio button or checkbox.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that's only visible to screen readers, used when the visual label isn't descriptive enough.", "isOptional": true }, { @@ -11195,7 +11464,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -11213,7 +11482,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the choice should be selected when it's first rendered.", "defaultValue": "false", "isOptional": true }, @@ -11222,7 +11491,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the choice is disabled and can't be selected.", "defaultValue": "false", "isOptional": true }, @@ -11240,7 +11509,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -11249,7 +11518,7 @@ "syntaxKind": "GetAccessor", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the choice is currently selected.", "defaultValue": "false", "isOptional": true }, @@ -11262,22 +11531,29 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\".", + "description": "The value that's submitted with the form when this choice is selected.", "isOptional": true } ], - "value": "declare class Choice extends PreactCustomElement implements ChoiceProps {\n accessor disabled: ChoiceProps['disabled'];\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n accessor value: ChoiceProps['value'];\n accessor accessibilityLabel: ChoiceProps['accessibilityLabel'];\n accessor defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Choice extends PolarisCustomElement implements ChoiceProps {\n /**\n * Whether the choice is disabled and can't be selected.\n */\n disabled: ChoiceProps['disabled'];\n /**\n * Whether the choice is currently selected.\n */\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n /**\n * The value that's submitted with the form when this choice is selected.\n */\n value: ChoiceProps['value'];\n /**\n * A label that's only visible to screen readers, used when the visual label isn't descriptive enough.\n */\n accessibilityLabel: ChoiceProps['accessibilityLabel'];\n /**\n * Whether the choice should be selected when it's first rendered.\n */\n defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -11300,7 +11576,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -11308,7 +11584,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -11316,7 +11592,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -11324,11 +11600,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -11340,15 +11616,14 @@ "ChoiceSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceSlots", - "description": "The choice list component supports slots for additional content placement within each choice. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The label text or elements that identify this selectable choice to users.\n\nThe label is produced by extracting and concatenating the text nodes from the provided content; any markup or element structure is ignored.", + "description": "The content that's used as the choice label, extracted as plain text from any provided markup.\n\nThe label is produced by extracting and concatenating the text nodes from the provided content; any markup or element structure is ignored.", "isOptional": true }, { @@ -11356,11 +11631,19 @@ "syntaxKind": "PropertySignature", "name": "details", "value": "HTMLElement", - "description": "Additional text to provide context or guidance for the input.\n\nThis text is displayed along with the input and its label to offer more information or instructions to the user.", + "description": "Additional text that provides context or guidance for the input, displayed alongside the choice label.\n\nThis text is displayed along with the input and its label to offer more information or instructions to the user.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "secondary-content", + "value": "HTMLElement", + "description": "Additional content to display below the choice label. Can include rich content like TextFields, Buttons, or other interactive components. Event handlers on React components are preserved.", "isOptional": true } ], - "value": "export interface ChoiceSlots {\n /**\n * The label text or elements that identify this selectable choice to users.\n *\n * The label is produced by extracting and\n * concatenating the text nodes from the provided content;\n * any markup or element structure is ignored.\n */\n children?: HTMLElement;\n /**\n * Additional text to provide context or guidance for the input.\n *\n * This text is displayed along with the input and its label\n * to offer more information or instructions to the user.\n *\n * @implementation this content should be linked to the input with an `aria-describedby` attribute.\n */\n details?: HTMLElement;\n}" + "value": "export interface ChoiceSlots {\n /**\n * The content that's used as the choice label, extracted as plain text from any provided markup.\n *\n * The label is produced by extracting and concatenating the text nodes from the provided content; any markup or element structure is ignored.\n */\n children?: HTMLElement;\n /**\n * Additional text that provides context or guidance for the input, displayed alongside the choice label.\n *\n * This text is displayed along with the input and its label to offer more information or instructions to the user.\n *\n * @implementation this content should be linked to the input with an `aria-describedby` attribute.\n */\n details?: HTMLElement;\n /**\n * Additional content to display below the choice label.\n * Can include rich content like TextFields, Buttons, or other interactive components.\n * Event handlers on React components are preserved.\n */\n 'secondary-content'?: HTMLElement;\n}" } } } @@ -11488,15 +11771,31 @@ "Clickable": { "filePath": "src/surfaces/admin/components.ts", "name": "Clickable", - "description": "Configure the following properties on the clickable component.", - "isPublicDocs": true, + "description": "", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { @@ -11504,7 +11803,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'", "isOptional": true }, @@ -11513,7 +11812,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -11540,7 +11839,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'", "isOptional": true }, @@ -11549,7 +11848,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'", "isOptional": true }, @@ -11558,7 +11857,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -11579,7 +11878,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -11588,7 +11887,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'", "isOptional": true }, @@ -11597,7 +11896,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -11606,7 +11905,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -11615,7 +11914,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -11624,7 +11923,7 @@ "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'", "isOptional": true }, @@ -11633,7 +11932,7 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated.", + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated.", "isOptional": true }, { @@ -11650,7 +11949,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the component is disabled, preventing clicks and focus. When disabled, the `click` event won't fire and click events from child elements stop propagating immediately. Interactive child elements can still receive focus and be interacted with. This doesn't apply visual styling by default. You shouldapply disabled styling as needed.", + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly.", "isOptional": true }, { @@ -11667,7 +11966,7 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'", "isOptional": true }, @@ -11676,7 +11975,7 @@ "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", "isOptional": true }, { @@ -11684,7 +11983,7 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { @@ -11692,7 +11991,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'", "isOptional": true }, @@ -11701,7 +12000,7 @@ "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated.", "isOptional": true }, { @@ -11709,7 +12008,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the component is in a loading state, which indicates to assistive technology that an action is in progress and prevents interaction.", + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable.", "isOptional": true }, { @@ -11717,7 +12016,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -11726,7 +12025,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -11735,7 +12034,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -11744,7 +12043,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -11753,7 +12052,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'", "isOptional": true }, @@ -11762,7 +12061,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'", "isOptional": true }, @@ -11771,7 +12070,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -11780,7 +12079,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -11789,7 +12088,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -11798,7 +12097,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -11807,7 +12106,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -11816,7 +12115,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -11825,7 +12124,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -11843,7 +12142,7 @@ "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'", "isOptional": true }, @@ -11852,139 +12151,132 @@ "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "defaultValue": "'button'", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n accessor disabled: ClickableProps['disabled'];\n accessor loading: ClickableProps['loading'];\n accessor target: ClickableProps['target'];\n accessor href: ClickableProps['href'];\n accessor download: ClickableProps['download'];\n accessor type: ClickableProps['type'];\n constructor();\n}" + "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n disabled: ClickableProps['disabled'];\n loading: ClickableProps['loading'];\n target: ClickableProps['target'];\n href: ClickableProps['href'];\n download: ClickableProps['download'];\n type: ClickableProps['type'];\n constructor();\n}" }, "AnyString": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AnyString", "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true + "description": "Prevents widening string literal types in a union to `string`." }, "AccessibilityRole": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -11992,14 +12284,13 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -12022,7 +12313,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -12030,7 +12321,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -12038,7 +12329,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -12046,11 +12337,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -12062,15 +12353,14 @@ "ClickableEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableEvents", - "description": "The clickable component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener | null", - "description": "A callback fired when the component loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -12078,7 +12368,7 @@ "syntaxKind": "PropertySignature", "name": "click", "value": "CallbackEventListener | null", - "description": "A callback fired when the component is clicked.\n\nLearn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", + "description": "", "isOptional": true }, { @@ -12086,27 +12376,25 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener | null", - "description": "A callback fired when the component receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true } ], - "value": "export interface ClickableEvents {\n /**\n * A callback fired when the component is clicked.\n *\n * Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n click: CallbackEventListener | null = null;\n /**\n * A callback fired when the component loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener | null = null;\n /**\n * A callback fired when the component receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener | null = null;\n}" + "value": "export interface ClickableEvents {\n click: CallbackEventListener | null = null;\n blur: CallbackEventListener | null = null;\n focus: CallbackEventListener | null = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -12118,19 +12406,18 @@ "ClickableSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableSlots", - "description": "The clickable component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The content displayed within the clickable component, which makes any content interactive and clickable without the semantic meaning of a button or link.", + "description": "The content to display inside the component. This can include text, components, or any other UI elements.", "isOptional": true } ], - "value": "export interface ClickableSlots {\n /**\n * The content displayed within the clickable component, which makes any content interactive and clickable without the semantic meaning of a button or link.\n */\n children?: HTMLElement;\n}" + "value": "export interface ClickableSlots {\n /**\n * The content to display inside the component. This can include text, components, or any other UI elements.\n */\n children?: HTMLElement;\n}" } } } @@ -12275,15 +12562,31 @@ "ClickableChip": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChip", - "description": "Configure the following properties on the clickable chip component.", - "isPublicDocs": true, + "description": "A custom element for displaying interactive chips that can be clicked or removed.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A text description of the chip for screen readers.", "isOptional": true }, { @@ -12309,7 +12612,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -12318,7 +12621,7 @@ "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "The color of the chip.", "defaultValue": "'base'", "isOptional": true }, @@ -12327,7 +12630,7 @@ "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'", "isOptional": true }, @@ -12336,7 +12639,7 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated.", + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated.", "isOptional": true }, { @@ -12353,7 +12656,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the chip is disabled, preventing any user interaction.", + "description": "Whether the chip is disabled and can't be clicked.", "defaultValue": "false", "isOptional": true }, @@ -12371,7 +12674,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Whether the chip is hidden from view. When using controlled component pattern with `removable` chips, update this property when the `remove` event fires. For non-removable chips, manually toggle this property to show or hide the chip.", + "description": "Whether the chip is hidden from view.", "defaultValue": "false", "isOptional": true }, @@ -12380,7 +12683,7 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", + "description": "The URL to navigate to when the chip is clicked.", "isOptional": true }, { @@ -12388,7 +12691,7 @@ "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated.", "isOptional": true }, { @@ -12396,7 +12699,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -12405,7 +12708,7 @@ "syntaxKind": "PropertyDeclaration", "name": "removable", "value": "boolean", - "description": "Whether the chip displays a remove button for dismissal. When clicked, the `remove` callback fires.", + "description": "Whether the chip can be removed by the user.", "defaultValue": "false", "isOptional": true }, @@ -12417,23 +12720,29 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class ClickableChip\n extends ClickableChip_base\n implements ClickableChipProps\n{\n accessor color: ClickableChipProps['color'];\n accessor accessibilityLabel: ClickableChipProps['accessibilityLabel'];\n accessor removable: ClickableChipProps['removable'];\n accessor hidden: ClickableChipProps['hidden'];\n accessor disabled: ClickableChipProps['disabled'];\n accessor href: ClickableChipProps['href'];\n constructor();\n}" + "value": "declare class ClickableChip\n extends ClickableChipBase\n implements ClickableChipProps\n{\n /**\n * The color of the chip.\n */\n color: ClickableChipProps['color'];\n constructor();\n}" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -12456,7 +12765,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -12464,7 +12773,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -12472,7 +12781,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -12480,11 +12789,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -12496,51 +12805,48 @@ "ClickableChipEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChipEvents", - "description": "The clickable chip component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "afterhide", - "value": "CallbackEventListener | null", - "description": "A callback fired after the chip is hidden.", + "value": "CallbackEventListener | null", + "description": "A callback that's fired after the chip finishes hiding.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "click", - "value": "CallbackEventListener | null", - "description": "A callback fired when the chip is clicked.\n\nLearn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", + "value": "CallbackEventListener | null", + "description": "A callback that's fired when the chip is clicked.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "remove", - "value": "CallbackEventListener | null", - "description": "A callback fired when the chip is removed.", + "value": "CallbackEventListener | null", + "description": "A callback that's fired when the chip is removed.", "isOptional": true } ], - "value": "export interface ClickableChipEvents {\n /**\n * A callback fired when the chip is clicked.\n *\n * Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n click: CallbackEventListener | null = null;\n /**\n * A callback fired when the chip is removed.\n */\n remove: CallbackEventListener | null = null;\n /**\n * A callback fired after the chip is hidden.\n */\n afterhide: CallbackEventListener | null = null;\n}" + "value": "export interface ClickableChipEvents {\n /**\n * A callback that's fired when the chip is clicked.\n */\n click: CallbackEventListener | null;\n /**\n * A callback that's fired when the chip is removed.\n */\n remove: CallbackEventListener | null;\n /**\n * A callback that's fired after the chip finishes hiding.\n */\n afterhide: CallbackEventListener | null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -12552,15 +12858,14 @@ "ClickableChipSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChipSlots", - "description": "The clickable chip component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The text label displayed within the chip, which represents an interactive filter, tag, or selectable item.", + "description": "The content of the chip.", "isOptional": true }, { @@ -12568,11 +12873,11 @@ "syntaxKind": "PropertySignature", "name": "graphic", "value": "HTMLElement", - "description": "An optional icon to display at the start of the chip. Accepts only icon components.", + "description": "An optional icon to display at the start of the chip. Accepts only Icon components.", "isOptional": true } ], - "value": "export interface ClickableChipSlots {\n /**\n * The text label displayed within the chip, which represents an interactive filter, tag, or selectable item.\n */\n children?: HTMLElement;\n /**\n * An optional icon to display at the start of the chip. Accepts only icon components.\n */\n graphic?: HTMLElement;\n}" + "value": "export interface ClickableChipSlots {\n /**\n * The content of the chip.\n */\n children?: HTMLElement;\n /**\n * An optional icon to display at the start of the chip. Accepts only Icon components.\n */\n graphic?: HTMLElement;\n}" } } } @@ -12706,18 +13011,34 @@ "ColorField": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorField", - "description": "Configure the following properties on the color field component.", - "isPublicDocs": true, + "description": "The color field custom element class that renders a color input field with integrated visual picker in the Shopify admin interface. This component allows merchants to select colors by typing hex values or using an interactive color picker, with optional support for transparency (alpha channel).", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@15957", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -12732,7 +13053,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false", "isOptional": true }, @@ -12750,7 +13071,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\"", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else", "isOptional": true }, @@ -12759,7 +13080,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -12777,15 +13098,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -12793,7 +13114,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -12810,8 +13131,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -12846,7 +13167,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -12854,7 +13175,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -12862,8 +13183,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -12871,7 +13192,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -12880,7 +13201,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -12888,7 +13209,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -12896,7 +13217,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -12905,7 +13226,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -12914,7 +13235,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -12936,22 +13257,29 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format.", + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).", "isOptional": true } ], - "value": "declare class ColorField\n extends PreactFieldElement\n implements ColorFieldProps\n{\n accessor alpha: ColorFieldProps['alpha'];\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n setInternalValue(value: string, normalize: boolean): void;\n}" + "value": "declare class ColorField extends ColorFieldBase implements ColorFieldProps {\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -12974,7 +13302,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -12982,7 +13310,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -12990,7 +13318,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -12998,11 +13326,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -13014,15 +13342,14 @@ "ColorFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorFieldEvents", - "description": "The color field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the color field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -13030,7 +13357,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the color field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -13038,7 +13365,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the color field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -13046,27 +13373,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the color field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface ColorFieldEvents {\n /**\n * A callback fired when the color field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the color field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the color field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the color field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface ColorFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -13273,61 +13598,15 @@ "ColorPicker": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorPicker", - "description": "Configure the following properties on the color picker component.", - "isPublicDocs": true, + "description": "A visual color picker component that allows users to select colors from a color spectrum interface.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$2@16111", - "value": "ElementInternals", - "description": "", - "isPrivate": true, - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true, - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "alpha", - "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", - "defaultValue": "false", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true, - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true, - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true, + "name": "alpha", + "value": "boolean", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", + "defaultValue": "false", "isOptional": true }, { @@ -13335,50 +13614,24 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial color value when the field first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts interacting, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", + "name": "formResetCallback", "value": "() => void", "description": "", "isPrivate": true, "isOptional": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "formResetCallback", - "value": "() => void", - "description": "A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`.", - "isOptional": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true, - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true, + "description": "The name of the picker, used when submitting form data.", "isOptional": true }, { @@ -13386,68 +13639,11 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format.", - "isOptional": true - } - ], - "value": "declare class ColorPicker extends BaseClass$2 implements ColorPickerProps {\n accessor alpha: boolean;\n accessor name: string;\n accessor defaultValue: string;\n get value(): string;\n set value(value: string);\n /**\n * A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`.\n */\n formResetCallback(): void;\n constructor();\n}" - }, - "ClickOptions": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ClickOptions", - "description": "", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "sourceEvent", - "value": "ActivationEventEsque", - "description": "The event you want to influence the synthetic click.", - "isOptional": true - } - ], - "value": "export interface ClickOptions {\n /**\n * The event you want to influence the synthetic click.\n */\n sourceEvent?: ActivationEventEsque;\n}" - }, - "ActivationEventEsque": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ActivationEventEsque", - "description": "", - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "button", - "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "ctrlKey", - "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "metaKey", - "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "shiftKey", - "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "declare class ColorPicker extends BaseClass implements ColorPickerProps {\n /**\n * Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.\n *\n * @default false\n */\n alpha: boolean;\n /**\n * The name of the picker, used when submitting form data.\n */\n name: string;\n /**\n * The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n defaultValue: string;\n /**\n * The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n}" } } }, @@ -13459,15 +13655,14 @@ "ColorPickerEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorPickerEvents", - "description": "The color picker component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener | null", - "description": "A callback fired when the color picker value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "The callback that's triggered when the selected color changes and the picker loses focus.", "isOptional": true }, { @@ -13475,27 +13670,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener | null", - "description": "A callback fired when the user inputs data into the color picker.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "The callback that's triggered when the selected color changes as the user interacts with the picker.", "isOptional": true } ], - "value": "export interface ColorPickerEvents {\n /**\n * A callback fired when the color picker value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener | null = null;\n /**\n * A callback fired when the user inputs data into the color picker.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener | null = null;\n}" + "value": "export interface ColorPickerEvents {\n /**\n * The callback that's triggered when the selected color changes and the picker loses focus.\n */\n change: CallbackEventListener | null = null;\n /**\n * The callback that's triggered when the selected color changes as the user interacts with the picker.\n */\n input: CallbackEventListener | null = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -13572,18 +13765,34 @@ "DateField": { "filePath": "src/surfaces/admin/components.ts", "name": "DateField", - "description": "Configure the following properties on the date field component.", - "isPublicDocs": true, + "description": "The date field custom element class that renders a date input field with integrated calendar picker in the Shopify admin interface. This component allows merchants to select dates by typing or using a visual calendar, with support for date range restrictions and day-of-week constraints.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@15957", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -13598,8 +13807,20 @@ "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ], "isOptional": true }, { @@ -13607,8 +13828,20 @@ "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ], "isOptional": true }, { @@ -13625,7 +13858,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "DateAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else", "isOptional": true }, @@ -13634,7 +13867,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -13652,8 +13885,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "defaultValue": "\"\"", + "description": "The default value for the field.", "isOptional": true }, { @@ -13661,15 +13893,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale.", + "description": "The initial month and year shown when the calendar picker first opens, formatted as an ISO 8601 date string.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -13677,7 +13909,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -13686,8 +13918,20 @@ "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ], "isOptional": true }, { @@ -13695,8 +13939,20 @@ "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ], "isOptional": true }, { @@ -13712,8 +13968,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -13748,7 +14004,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -13756,7 +14012,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -13764,8 +14020,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -13773,7 +14029,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -13782,7 +14038,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -13790,7 +14046,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -13798,7 +14054,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -13807,7 +14063,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -13816,7 +14072,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -13829,13 +14085,20 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected date in `YYYY-MM-DD` format. An empty string means no date is selected.", - "defaultValue": "\"\"", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true }, { @@ -13843,25 +14106,23 @@ "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`.", + "description": "The currently visible month and year in the calendar picker, formatted as an ISO 8601 date string.", "isOptional": true } ], - "value": "declare class DateField\n extends PreactFieldElement\n implements DateFieldProps\n{\n accessor allow: DateFieldProps['allow'];\n accessor disallow: DateFieldProps['disallow'];\n accessor allowDays: DateFieldProps['allowDays'];\n accessor disallowDays: DateFieldProps['disallowDays'];\n set view(view: string);\n get view(): string;\n accessor defaultView: DateFieldProps['defaultView'];\n constructor();\n}" + "value": "declare class DateField extends DateFieldBase implements DateFieldProps {\n constructor();\n}" }, "DateAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "DateAutocompleteField", "value": "'bday-day' | 'bday-month' | 'bday-year' | 'bday' | 'cc-expiry-month' | 'cc-expiry-year' | 'cc-expiry'", - "description": "Represents autocomplete values that are valid for date input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for date-based inputs.\n\nAvailable values:\n- `bday` - Complete birthday date\n- `bday-day` - Day component of a birthday (1-31)\n- `bday-month` - Month component of a birthday (1-12)\n- `bday-year` - Year component of a birthday (1990)\n- `cc-expiry` - Complete credit card expiration date\n- `cc-expiry-month` - Month component of a credit card expiration date (1-12)\n- `cc-expiry-year` - Year component of a credit card expiration date (2025)", - "isPublicDocs": true + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -13884,7 +14145,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -13892,7 +14153,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -13900,7 +14161,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -13908,11 +14169,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -13924,15 +14185,14 @@ "DateFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "DateFieldEvents", - "description": "The date field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the date field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -13940,7 +14200,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the date field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -13948,7 +14208,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the date field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -13956,43 +14216,41 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the date field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "invalid", - "value": "CallbackEventListener | null", - "description": "A callback fired when the date field value is invalid.\n\nLearn more about the [invalid event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/invalid_event).", + "value": "CallbackEventListener<'s-date-field'> | null", + "description": "The callback that's triggered when the user attempts to enter an invalid date.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "viewchange", - "value": "CallbackEventListener | null", - "description": "A callback fired when the calendar view changes (such as when navigating between months).", + "value": "CallbackEventListener<'s-date-field'> | null", + "description": "The callback that's triggered when the visible month or year in the calendar changes.", "isOptional": true } ], - "value": "export interface DateFieldEvents {\n /**\n * A callback fired when the date field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the date field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the date field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the date field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n /**\n * A callback fired when the calendar view changes (such as when navigating between months).\n */\n viewchange: CallbackEventListener | null = null;\n /**\n * A callback fired when the date field value is invalid.\n *\n * Learn more about the [invalid event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/invalid_event).\n */\n invalid: CallbackEventListener | null = null;\n}" + "value": "export interface DateFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n /**\n * The callback that's triggered when the visible month or year in the calendar changes.\n */\n viewchange: CallbackEventListener<'s-date-field'> | null;\n /**\n * The callback that's triggered when the user attempts to enter an invalid date.\n */\n invalid: CallbackEventListener<'s-date-field'> | null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -14205,27 +14463,43 @@ "DatePicker": { "filePath": "src/surfaces/admin/components.ts", "name": "DatePicker", - "description": "Configure the following properties on the date picker component.", - "isPublicDocs": true, + "description": "The date picker custom element class that renders a standalone calendar interface in the Shopify admin. This component allows merchants to select single dates or date ranges using an interactive calendar with month/year navigation, date constraints, and day-of-week restrictions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@dirtyStateSymbol@16155", + "name": "__@dirtyStateSymbol@16932", "value": "boolean", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$1@16154", + "name": "__@internals$1@16931", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -14240,8 +14514,20 @@ "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ], "isOptional": true }, { @@ -14249,8 +14535,20 @@ "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ], "isOptional": true }, { @@ -14267,7 +14565,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -14285,7 +14583,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initially selected date(s) when the component first renders. An empty string means no date is initially selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The initial selected date or date range when the picker first renders, formatted as an ISO 8601 date string.", "defaultValue": "\"\"", "isOptional": true }, @@ -14294,7 +14592,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale.", + "description": "The initial month and year shown when the calendar first renders, formatted as an ISO 8601 date string.", "isOptional": true }, { @@ -14302,8 +14600,20 @@ "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ], "isOptional": true }, { @@ -14311,9 +14621,21 @@ "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", "defaultValue": "\"\"", - "isOptional": true + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ], + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", @@ -14338,7 +14660,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "The name of the picker, used when submitting form data.", "isOptional": true }, { @@ -14346,7 +14668,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -14364,16 +14686,24 @@ "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"single\" | \"range\"", - "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "description": "The type of date selection allowed. Available values: `single`, `range`.", "defaultValue": "\"single\"", "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "value", "value": "string", - "description": "The currently selected date(s). An empty string means no date is selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The currently selected date or date range, formatted as an ISO 8601 date string.", "defaultValue": "\"\"", "isOptional": true }, @@ -14382,17 +14712,16 @@ "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`.", + "description": "The currently visible month and year in the calendar, formatted as an ISO 8601 date string.", "isOptional": true } ], - "value": "declare class DatePicker extends BaseClass$1 implements DatePickerProps {\n accessor defaultView: string;\n set view(view: string);\n get view(): string;\n accessor allow: DatePickerProps['allow'];\n accessor disallow: DatePickerProps['disallow'];\n accessor allowDays: DatePickerProps['allowDays'];\n accessor disallowDays: DatePickerProps['disallowDays'];\n accessor type: DatePickerProps['type'];\n accessor defaultValue: DatePickerProps['defaultValue'];\n accessor name: DatePickerProps['name'];\n set value(value: string);\n get value(): string;\n /** @private */\n [dirtyStateSymbol]: boolean;\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DatePicker\n extends DatePickerBase\n implements DatePickerProps\n{\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -14415,7 +14744,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -14423,7 +14752,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -14431,7 +14760,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -14439,11 +14768,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -14455,67 +14784,64 @@ "DatePickerEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "DatePickerEvents", - "description": "The date picker component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", - "value": "CallbackEventListener | null", - "description": "A callback fired when the date picker loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "value": "CallbackEventListener | null", + "description": "The callback that's triggered when the picker loses focus.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "change", - "value": "CallbackEventListener | null", - "description": "A callback fired when the date picker value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "value": "CallbackEventListener | null", + "description": "The callback that's triggered when the selected date changes and the picker loses focus.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "focus", - "value": "CallbackEventListener | null", - "description": "A callback fired when the date picker receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "value": "CallbackEventListener | null", + "description": "The callback that's triggered when the picker receives focus.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "input", - "value": "CallbackEventListener | null", - "description": "A callback fired when the user inputs data into the date picker.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "value": "CallbackEventListener | null", + "description": "The callback that's triggered when the selected date changes as the user interacts with the picker.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "viewchange", - "value": "CallbackEventListener | null", - "description": "A callback fired when the calendar view changes, such as when navigating between months.", + "value": "CallbackEventListener | null", + "description": "The callback that's triggered when the visible month or year in the calendar changes.", "isOptional": true } ], - "value": "export interface DatePickerEvents {\n /**\n * A callback fired when the calendar view changes, such as when navigating between months.\n */\n viewchange: CallbackEventListener | null = null;\n /**\n * A callback fired when the date picker receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener | null = null;\n /**\n * A callback fired when the date picker loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener | null = null;\n /**\n * A callback fired when the user inputs data into the date picker.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener | null = null;\n /**\n * A callback fired when the date picker value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener | null = null;\n}" + "value": "export interface DatePickerEvents {\n /**\n * The callback that's triggered when the visible month or year in the calendar changes.\n */\n viewchange: CallbackEventListener | null;\n /**\n * The callback that's triggered when the picker receives focus.\n */\n focus: CallbackEventListener | null;\n /**\n * The callback that's triggered when the picker loses focus.\n */\n blur: CallbackEventListener | null;\n /**\n * The callback that's triggered when the selected date changes as the user interacts with the picker.\n */\n input: CallbackEventListener | null;\n /**\n * The callback that's triggered when the selected date changes and the picker loses focus.\n */\n change: CallbackEventListener | null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -14643,9 +14969,25 @@ "Divider": { "filePath": "src/surfaces/admin/components.ts", "name": "Divider", - "description": "Configure the following properties on the divider component.", - "isPublicDocs": true, + "description": "A divider is a visual separator that creates a line between different sections of content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -14669,7 +15011,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -14714,7 +15056,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -14726,15 +15068,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Divider extends PreactCustomElement implements DividerProps {\n accessor direction: DividerProps['direction'];\n accessor color: DividerProps['color'];\n constructor();\n}" + "value": "declare class Divider extends PolarisCustomElement implements DividerProps {\n /**\n * The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n *\n * - `inline`: Horizontal divider for separating vertically stacked content\n * - `block`: Vertical divider for separating horizontally arranged content\n *\n * @default 'inline'\n */\n direction: DividerProps['direction'];\n /**\n * The visual prominence of the divider line.\n *\n * - `base`: Standard divider for most separations (default)\n * - `strong`: More prominent divider for major section breaks\n *\n * @default 'base'\n */\n color: DividerProps['color'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -14757,7 +15106,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -14765,7 +15114,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -14773,7 +15122,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -14781,11 +15130,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } } @@ -14902,13 +15251,20 @@ "DropZone": { "filePath": "src/surfaces/admin/components.ts", "name": "DropZone", - "description": "Configure the following properties on the drop zone component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@getFileInput@16192", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@getFileInput@16970", "value": "() => HTMLInputElement", "description": "", "isPrivate": true, @@ -14917,7 +15273,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals@16191", + "name": "__@internals@16969", "value": "ElementInternals", "description": "", "isPrivate": true, @@ -14926,12 +15282,21 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@setFiles@16190", + "name": "__@setFiles@16968", "value": "(files: File[]) => void", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", @@ -14972,7 +15337,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -14990,7 +15355,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -15007,8 +15372,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -15033,8 +15398,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -15042,7 +15407,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -15060,7 +15425,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -15068,7 +15433,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -15077,7 +15442,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -15090,6 +15455,14 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -15100,13 +15473,12 @@ "isOptional": true } ], - "value": "declare class DropZone extends BaseClass implements DropZoneProps {\n accessor accept: DropZoneProps['accept'];\n accessor accessibilityLabel: DropZoneProps['accessibilityLabel'];\n accessor disabled: DropZoneProps['disabled'];\n accessor error: DropZoneProps['error'];\n accessor label: DropZoneProps['label'];\n accessor labelAccessibilityVisibility: DropZoneProps['labelAccessibilityVisibility'];\n accessor multiple: DropZoneProps['multiple'];\n accessor name: DropZoneProps['name'];\n accessor required: DropZoneProps['required'];\n get value(): string;\n /** This sets the input value for a file type, which cannot be set programatically, so it can only be reset. */\n set value(value: '' | null);\n get files(): File[];\n set files(files: File[]);\n /** @private */\n [setFiles](files: File[]): void;\n /** @private */\n [getFileInput](): ReplaceType<\n Element | null | undefined,\n Element,\n HTMLInputElement\n >;\n\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DropZone extends DropZoneBase implements DropZoneProps {\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -15129,7 +15501,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -15137,7 +15509,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -15145,7 +15517,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -15153,11 +15525,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -15169,51 +15541,48 @@ "DropZoneEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "DropZoneEvents", - "description": "The drop zone component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "change", - "value": "CallbackEventListener", - "description": "A callback fired when the drop zone value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "value": "CallbackEventListener", + "description": "A callback fired when the user selects files through the file picker or drops valid files onto the drop zone. Access the selected files through `event.currentTarget.files`. Use to process uploads, generate previews, or validate file contents.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "droprejected", - "value": "CallbackEventListener", - "description": "A callback fired when a dropped file is rejected due to file type or size restrictions.", + "value": "CallbackEventListener", + "description": "A callback fired when dropped or selected files don't match the `accept` criteria. Use to display error messages explaining which file types are allowed. Rejected files are not added to the `files` array.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "input", - "value": "CallbackEventListener", - "description": "A callback fired when the user inputs data into the drop zone.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "value": "CallbackEventListener", + "description": "A callback fired when files are selected or dropped. Similar to `onChange` but may fire more frequently during drag operations. Use when you need immediate feedback as files are being dragged over the drop zone.", "isOptional": true } ], - "value": "export interface DropZoneEvents {\n /**\n * A callback fired when the drop zone value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener = null;\n /**\n * A callback fired when the user inputs data into the drop zone.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener = null;\n /**\n * A callback fired when a dropped file is rejected due to file type or size restrictions.\n */\n droprejected: CallbackEventListener = null;\n}" + "value": "export interface DropZoneEvents {\n /**\n * A callback fired when the user selects files through the file picker or drops valid\n * files onto the drop zone. Access the selected files through `event.currentTarget.files`.\n * Use to process uploads, generate previews, or validate file contents.\n */\n change: CallbackEventListener;\n /**\n * A callback fired when files are selected or dropped. Similar to `onChange` but may\n * fire more frequently during drag operations. Use when you need immediate feedback as\n * files are being dragged over the drop zone.\n */\n input: CallbackEventListener;\n /**\n * A callback fired when dropped or selected files don't match the `accept` criteria.\n * Use to display error messages explaining which file types are allowed. Rejected files\n * are not added to the `files` array.\n */\n droprejected: CallbackEventListener;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -15419,18 +15788,34 @@ "EmailField": { "filePath": "src/surfaces/admin/components.ts", "name": "EmailField", - "description": "Configure the following properties on the email field component.", - "isPublicDocs": true, + "description": "The email field custom element class that renders an email input field in the Shopify admin interface. This component allows merchants to enter email addresses with automatic validation and optimized mobile keyboard layouts.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@15957", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -15454,8 +15839,8 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | EmailAutocompleteField | `section-${string} email` | `section-${string} home email` | `section-${string} mobile email` | `section-${string} fax email` | `section-${string} pager email` | \"shipping email\" | \"shipping home email\" | \"shipping mobile email\" | \"shipping fax email\" | \"shipping pager email\" | \"billing email\" | \"billing home email\" | \"billing mobile email\" | \"billing fax email\" | \"billing pager email\" | `section-${string} shipping email` | `section-${string} shipping home email` | `section-${string} shipping mobile email` | `section-${string} shipping fax email` | `section-${string} shipping pager email` | `section-${string} billing email` | `section-${string} billing home email` | `section-${string} billing mobile email` | `section-${string} billing fax email` | `section-${string} billing pager email`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else", + "description": "A hint as to the intended content of the field for autocomplete purposes.", + "defaultValue": "'email'", "isOptional": true }, { @@ -15463,7 +15848,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -15481,15 +15866,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -15497,7 +15882,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -15514,8 +15899,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -15550,7 +15935,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -15558,7 +15943,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -15566,8 +15951,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -15575,7 +15960,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -15584,7 +15969,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity", "isOptional": true }, @@ -15593,7 +15978,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0", "isOptional": true }, @@ -15602,7 +15987,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -15610,7 +15995,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -15618,7 +16003,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -15627,7 +16012,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -15636,7 +16021,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -15649,30 +16034,36 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing.", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true } ], - "value": "declare class EmailField\n extends PreactFieldElement\n implements EmailFieldProps\n{\n accessor autocomplete: EmailFieldProps['autocomplete'];\n accessor maxLength: EmailFieldProps['maxLength'];\n accessor minLength: EmailFieldProps['minLength'];\n /**\n * The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class EmailField extends EmailFieldBase implements EmailFieldProps {\n constructor();\n}" }, "EmailAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "EmailAutocompleteField", "value": "'email' | 'home email' | 'mobile email' | 'fax email' | 'pager email'", - "description": "Represents autocomplete values that are valid for email input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for email inputs.\n\nAvailable values:\n- `email` - Primary email address\n- `home email` - Home email address\n- `mobile email` - Mobile device email address\n- `fax email` - Fax machine email address\n- `pager email` - Pager device email address", - "isPublicDocs": true + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -15695,7 +16086,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -15703,7 +16094,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -15711,7 +16102,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -15719,11 +16110,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -15735,15 +16126,14 @@ "EmailFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "EmailFieldEvents", - "description": "The email field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the email field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -15751,7 +16141,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the email field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -15759,7 +16149,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the email field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -15767,27 +16157,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the email field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface EmailFieldEvents {\n /**\n * A callback fired when the email field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the email field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the email field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the email field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface EmailFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -15921,15 +16309,31 @@ "Grid": { "filePath": "src/surfaces/admin/components.ts", "name": "Grid", - "description": "Configure the following properties on the grid component.", - "isPublicDocs": true, + "description": "A grid is a layout component that arranges its children in rows and columns with precise control over sizing and alignment.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { @@ -15937,7 +16341,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'", "isOptional": true }, @@ -15946,7 +16350,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -15964,7 +16368,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "\"\" | AlignContentKeyword", - "description": "Aligns the grid along the block axis. This overrides the block value of `placeContent`.", + "description": "The alignment of the grid along the block axis.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -15973,7 +16377,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "\"\" | AlignItemsKeyword", - "description": "Aligns the grid items along the block axis.", + "description": "The alignment of grid items along the block axis.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -15991,7 +16395,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'", "isOptional": true }, @@ -16000,7 +16404,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'", "isOptional": true }, @@ -16009,7 +16413,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -16030,7 +16434,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16039,7 +16443,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'", "isOptional": true }, @@ -16048,7 +16452,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16057,7 +16461,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16066,7 +16470,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -16075,7 +16479,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid columns.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16102,7 +16506,7 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'", "isOptional": true }, @@ -16111,7 +16515,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows and columns.", "defaultValue": "'none'", "isOptional": true }, @@ -16120,7 +16524,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridTemplateColumns", "value": "string", - "description": "The columns in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid columns.", "defaultValue": "'none'", "isOptional": true }, @@ -16129,7 +16533,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridTemplateRows", "value": "string", - "description": "The rows in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid rows.", "defaultValue": "'none'", "isOptional": true }, @@ -16138,7 +16542,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'", "isOptional": true }, @@ -16147,7 +16551,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "\"\" | JustifyContentKeyword", - "description": "Aligns the grid along the inline axis. This overrides the inline value of `placeContent`.", + "description": "The alignment of the grid along the inline axis.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16156,7 +16560,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyItems", "value": "\"\" | JustifyItemsKeyword", - "description": "Aligns the grid items along the inline axis.", + "description": "The alignment of grid items along the inline axis.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16165,7 +16569,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -16174,7 +16578,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -16183,7 +16587,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -16192,7 +16596,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -16201,7 +16605,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'", "isOptional": true }, @@ -16210,7 +16614,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'", "isOptional": true }, @@ -16219,7 +16623,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16228,7 +16632,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16237,7 +16641,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16246,7 +16650,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16255,7 +16659,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16264,7 +16668,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16273,7 +16677,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeContent", "value": "\"normal normal\" | \"normal stretch\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\" | AlignContentKeyword | \"normal space-between\" | \"normal space-around\" | \"normal space-evenly\" | \"baseline space-between\" | \"baseline space-around\" | \"baseline space-evenly\" | \"first baseline space-between\" | \"first baseline space-around\" | \"first baseline space-evenly\" | \"last baseline space-between\" | \"last baseline space-around\" | \"last baseline space-evenly\" | \"start space-between\" | \"start space-around\" | \"start space-evenly\" | \"end space-between\" | \"end space-around\" | \"end space-evenly\" | \"center space-between\" | \"center space-around\" | \"center space-evenly\" | \"unsafe start space-between\" | \"unsafe start space-around\" | \"unsafe start space-evenly\" | \"unsafe end space-between\" | \"unsafe end space-around\" | \"unsafe end space-evenly\" | \"unsafe center space-between\" | \"unsafe center space-around\" | \"unsafe center space-evenly\" | \"safe start space-between\" | \"safe start space-around\" | \"safe start space-evenly\" | \"safe end space-between\" | \"safe end space-around\" | \"safe end space-evenly\" | \"safe center space-between\" | \"safe center space-around\" | \"safe center space-evenly\" | \"stretch space-between\" | \"stretch space-around\" | \"stretch space-evenly\" | \"space-between normal\" | \"space-between start\" | \"space-between end\" | \"space-between center\" | \"space-between unsafe start\" | \"space-between unsafe end\" | \"space-between unsafe center\" | \"space-between safe start\" | \"space-between safe end\" | \"space-between safe center\" | \"space-between stretch\" | \"space-between space-between\" | \"space-between space-around\" | \"space-between space-evenly\" | \"space-around normal\" | \"space-around start\" | \"space-around end\" | \"space-around center\" | \"space-around unsafe start\" | \"space-around unsafe end\" | \"space-around unsafe center\" | \"space-around safe start\" | \"space-around safe end\" | \"space-around safe center\" | \"space-around stretch\" | \"space-around space-between\" | \"space-around space-around\" | \"space-around space-evenly\" | \"space-evenly normal\" | \"space-evenly start\" | \"space-evenly end\" | \"space-evenly center\" | \"space-evenly unsafe start\" | \"space-evenly unsafe end\" | \"space-evenly unsafe center\" | \"space-evenly safe start\" | \"space-evenly safe end\" | \"space-evenly safe center\" | \"space-evenly stretch\" | \"space-evenly space-between\" | \"space-evenly space-around\" | \"space-evenly space-evenly\"", - "description": "A shorthand property for `justify-content` and `align-content`.", + "description": "A shorthand for setting both `alignContent` and `justifyContent`.", "defaultValue": "'normal normal'", "isOptional": true }, @@ -16282,7 +16686,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeItems", "value": "AlignItemsKeyword | \"normal normal\" | \"normal stretch\" | \"normal baseline\" | \"normal first baseline\" | \"normal last baseline\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch baseline\" | \"stretch first baseline\" | \"stretch last baseline\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline baseline\" | \"baseline first baseline\" | \"baseline last baseline\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline baseline\" | \"first baseline first baseline\" | \"first baseline last baseline\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline baseline\" | \"last baseline first baseline\" | \"last baseline last baseline\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start baseline\" | \"start first baseline\" | \"start last baseline\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end baseline\" | \"end first baseline\" | \"end last baseline\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center baseline\" | \"center first baseline\" | \"center last baseline\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start baseline\" | \"unsafe start first baseline\" | \"unsafe start last baseline\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end baseline\" | \"unsafe end first baseline\" | \"unsafe end last baseline\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center baseline\" | \"unsafe center first baseline\" | \"unsafe center last baseline\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start baseline\" | \"safe start first baseline\" | \"safe start last baseline\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end baseline\" | \"safe end first baseline\" | \"safe end last baseline\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center baseline\" | \"safe center first baseline\" | \"safe center last baseline\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\"", - "description": "A shorthand property for `justify-items` and `align-items`.", + "description": "A shorthand for setting both `alignItems` and `justifyItems`.", "defaultValue": "'normal normal'", "isOptional": true }, @@ -16291,7 +16695,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -16300,7 +16704,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "s spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16312,200 +16716,185 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n accessor gridTemplateColumns: GridProps['gridTemplateColumns'];\n accessor gridTemplateRows: GridProps['gridTemplateRows'];\n accessor justifyItems: GridProps['justifyItems'];\n accessor alignItems: GridProps['alignItems'];\n accessor placeItems: GridProps['placeItems'];\n accessor justifyContent: GridProps['justifyContent'];\n accessor alignContent: GridProps['alignContent'];\n accessor placeContent: GridProps['placeContent'];\n accessor gap: GridProps['gap'];\n accessor rowGap: GridProps['rowGap'];\n accessor columnGap: GridProps['columnGap'];\n}" + "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n /**\n * The template that defines the grid columns.\n */\n gridTemplateColumns: GridProps['gridTemplateColumns'];\n /**\n * The template that defines the grid rows.\n */\n gridTemplateRows: GridProps['gridTemplateRows'];\n /**\n * The alignment of grid items along the inline axis.\n */\n justifyItems: GridProps['justifyItems'];\n /**\n * The alignment of grid items along the block axis.\n */\n alignItems: GridProps['alignItems'];\n /**\n * A shorthand for setting both `alignItems` and `justifyItems`.\n */\n placeItems: GridProps['placeItems'];\n /**\n * The alignment of the grid along the inline axis.\n */\n justifyContent: GridProps['justifyContent'];\n /**\n * The alignment of the grid along the block axis.\n */\n alignContent: GridProps['alignContent'];\n /**\n * A shorthand for setting both `alignContent` and `justifyContent`.\n */\n placeContent: GridProps['placeContent'];\n /**\n * The spacing between grid rows and columns.\n */\n gap: GridProps['gap'];\n /**\n * The spacing between grid rows.\n */\n rowGap: GridProps['rowGap'];\n /**\n * The spacing between grid columns.\n */\n columnGap: GridProps['columnGap'];\n}" }, "JustifyItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.\n\nLearn more about the [justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).", - "isPublicDocs": true + "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis." }, "BaselinePosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BaselinePosition", "value": "'baseline' | 'first baseline' | 'last baseline'", - "description": "Represents baseline alignment positions used to align items relative to their baselines.\n- `baseline`: Aligns to the baseline of the parent.\n- `first baseline`: Aligns to the first baseline of the parent.\n- `last baseline`: Aligns to the last baseline of the parent.", - "isPublicDocs": true + "description": "" }, "OverflowPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "OverflowPosition", "value": "`unsafe ${ContentPosition}` | `safe ${ContentPosition}`", - "description": "Represents content positioning with overflow behavior control. Use `safe` to prevent content from becoming inaccessible when it overflows, or `unsafe` to allow overflow regardless of accessibility.", - "isPublicDocs": true + "description": "" }, "ContentPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentPosition", "value": "'center' | 'start' | 'end'", - "description": "Defines the position of content along an axis.\n- `center`: Centers the content.\n- `start`: Aligns content to the start.\n- `end`: Aligns content to the end.", - "isPublicDocs": true + "description": "" }, "AlignItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Align items sets the align-self value on all direct children as a group.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isPublicDocs": true + "description": "Align items sets the align-self value on all direct children as a group." }, "JustifyContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyContentKeyword", "value": "'normal' | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", - "isPublicDocs": true + "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container." }, "ContentDistribution": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentDistribution", "value": "'space-between' | 'space-around' | 'space-evenly' | 'stretch'", - "description": "Defines how space is distributed between and around content items in flex and grid layouts.\n- `space-between`: Distributes items evenly with the first item at the start and last at the end.\n- `space-around`: Distributes items evenly with equal space around each item.\n- `space-evenly`: Distributes items evenly with equal space between them.\n- `stretch`: Stretches items to fill the container.", - "isPublicDocs": true + "description": "" }, "AlignContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignContentKeyword", "value": "'normal' | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isPublicDocs": true + "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis." }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "SpacingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SpacingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the spacing size between elements, using the standard size scale or `none` for no spacing.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "AccessibilityRole": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -16513,14 +16902,13 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -16543,7 +16931,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -16551,7 +16939,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -16559,7 +16947,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -16567,11 +16955,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -16583,19 +16971,18 @@ "GridSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "GridSlots", - "description": "The grid component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The child elements displayed within the grid component, which are arranged in a flexible grid layout with configurable columns, rows, and spacing.", + "description": "The child elements to render inside the grid.", "isOptional": true } ], - "value": "export interface GridSlots {\n /**\n * The child elements displayed within the grid component, which are arranged in a flexible grid layout with configurable columns, rows, and spacing.\n */\n children?: HTMLElement;\n}" + "value": "export interface GridSlots {\n /**\n * The child elements to render inside the grid.\n */\n children?: HTMLElement;\n}" } } }, @@ -16607,15 +16994,31 @@ "GridItem": { "filePath": "src/surfaces/admin/components.ts", "name": "GridItem", - "description": "The grid item component represents a single cell within a grid layout, allowing you to control how content is positioned and sized within the grid. Use grid item as a child of grid to specify column span, row span, and positioning for individual content areas.\n\nGrid item supports precise placement control through column and row properties, enabling you to create complex layouts where different items occupy varying amounts of space or appear in specific grid positions.", - "isPublicDocs": true, + "description": "A grid item is a child of a grid that can be positioned within specific rows and columns.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { @@ -16623,7 +17026,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'", "isOptional": true }, @@ -16632,7 +17035,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -16659,7 +17062,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'", "isOptional": true }, @@ -16668,7 +17071,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'", "isOptional": true }, @@ -16677,7 +17080,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -16698,7 +17101,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16707,7 +17110,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'", "isOptional": true }, @@ -16716,7 +17119,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16725,7 +17128,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16734,7 +17137,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -16761,7 +17164,7 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'", "isOptional": true }, @@ -16770,7 +17173,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridColumn", "value": "\"auto\" | `span ${number}`", - "description": "The number of columns the item will span across.\n\nLearn more about the [grid-column property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).", + "description": "The column position and span of the grid item.", "defaultValue": "'auto'", "isOptional": true }, @@ -16779,7 +17182,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridRow", "value": "\"auto\" | `span ${number}`", - "description": "The number of rows the item will span across.\n\nLearn more about the [grid-row property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).", + "description": "The row position and span of the grid item.", "defaultValue": "'auto'", "isOptional": true }, @@ -16788,7 +17191,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'", "isOptional": true }, @@ -16797,7 +17200,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -16806,7 +17209,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -16815,7 +17218,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -16824,7 +17227,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -16833,7 +17236,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'", "isOptional": true }, @@ -16842,7 +17245,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'", "isOptional": true }, @@ -16851,7 +17254,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16860,7 +17263,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16869,7 +17272,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16878,7 +17281,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16887,7 +17290,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16896,7 +17299,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -16905,7 +17308,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -16917,128 +17320,122 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class GridItem extends BoxElement implements GridItemProps {\n accessor gridColumn: GridItemProps['gridColumn'];\n accessor gridRow: GridItemProps['gridRow'];\n constructor();\n}" + "value": "declare class GridItem extends BoxElement implements GridItemProps {\n /**\n * The column position and span of the grid item.\n */\n gridColumn: GridItemProps['gridColumn'];\n /**\n * The row position and span of the grid item.\n */\n gridRow: GridItemProps['gridRow'];\n constructor();\n}" }, "AccessibilityRole": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -17046,14 +17443,13 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -17076,7 +17472,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -17084,7 +17480,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -17092,7 +17488,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -17100,11 +17496,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -17116,19 +17512,18 @@ "GridItemSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "GridItemSlots", - "description": "The grid item component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The content displayed within the grid item component, which represents a single cell in the grid layout and can span multiple columns or rows.", + "description": "The child elements to render inside the grid item.", "isOptional": true } ], - "value": "export interface GridItemSlots {\n /**\n * The content displayed within the grid item component, which represents a single cell in the grid layout and can span multiple columns or rows.\n */\n children?: HTMLElement;\n}" + "value": "export interface GridItemSlots {\n /**\n * The child elements to render inside the grid item.\n */\n children?: HTMLElement;\n}" } } } @@ -17245,15 +17640,31 @@ "Heading": { "filePath": "src/surfaces/admin/components.ts", "name": "Heading", - "description": "Configure the following properties on the heading component.", - "isPublicDocs": true, + "description": "A custom element for displaying hierarchical section titles and headings with appropriate semantic meaning and visual styling. Use Heading to structure your content with proper heading levels for both visual hierarchy and accessibility.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"heading\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The ARIA role for the heading. Set to `'heading'` (the default) for standard heading semantics, or `'presentation'` / `'none'` to remove heading semantics for decorative use.", "defaultValue": "'heading'", "isOptional": true }, @@ -17262,7 +17673,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'", "isOptional": true }, @@ -17289,7 +17700,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -17316,7 +17727,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lineClamp", "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", "defaultValue": "Infinity - no truncation is applied", "isOptional": true }, @@ -17325,7 +17736,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -17337,15 +17748,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Heading extends PreactCustomElement implements HeadingProps {\n accessor accessibilityRole: HeadingProps['accessibilityRole'];\n accessor lineClamp: HeadingProps['lineClamp'];\n accessor accessibilityVisibility: HeadingProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Heading extends HeadingBase implements HeadingProps {\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -17368,7 +17786,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -17376,7 +17794,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -17384,7 +17802,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -17392,11 +17810,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -17408,19 +17826,18 @@ "HeadingSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "HeadingSlots", - "description": "The heading component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The heading text displayed within the heading component, which provides a title or section header for content.", + "description": "The content of the heading.", "isOptional": true } ], - "value": "export interface HeadingSlots {\n /**\n * The heading text displayed within the heading component, which provides a title or section header for content.\n */\n children?: HTMLElement;\n}" + "value": "export interface HeadingSlots {\n /**\n * The content of the heading.\n */\n children?: HTMLElement;\n}" } } } @@ -17519,7 +17936,7 @@ "title": "Available icons", "type": "Generic", "anchorLink": "available-icons", - "sectionContent": "Search and filter across all the available icons: \n \n " + "sectionContent": "Search and filter across all the available icons: \n \n " }, { "title": "Best practices", @@ -17543,9 +17960,25 @@ "Icon": { "filePath": "src/surfaces/admin/components.ts", "name": "Icon", - "description": "Configure the following properties on the icon component.", - "isPublicDocs": true, + "description": "An icon displays a graphical symbol from the icon library.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -17569,7 +18002,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -17578,7 +18011,7 @@ "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color emphasis of the icon.", "defaultValue": "'base'", "isOptional": true }, @@ -17605,7 +18038,7 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "The element that this icon should show interest for when activated.", "isOptional": true }, { @@ -17613,7 +18046,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -17631,7 +18064,7 @@ "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"base\"", - "description": "The size of the icon.\n\n- `small`: Smaller icon suitable for inline use within text or compact UI elements.\n- `base`: Default size that works well for standalone icons and standard use cases.", + "description": "The size of the icon.", "defaultValue": "'base'", "isOptional": true }, @@ -17640,7 +18073,7 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", + "description": "The color tone of the icon based on its semantic meaning.", "defaultValue": "'auto'", "isOptional": true }, @@ -17648,18 +18081,32 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "The icon to display from the icon library.\n\nSet to a valid icon name to display that icon. To hide the icon completely, use an empty string `''`. To reserve the icon's space without displaying an icon, use `'empty'`.", + "value": "\"\" | IconType", + "description": "The type of icon to display.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", "isOptional": true } ], - "value": "declare class Icon extends PreactCustomElement implements IconProps {\n accessor color: IconProps['color'];\n accessor tone: IconProps['tone'];\n accessor type: IconProps['type'];\n accessor size: IconProps['size'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Icon extends IconBase implements IconProps {\n /**\n * The color tone of the icon based on its semantic meaning.\n */\n tone: IconProps['tone'];\n /**\n * The type of icon to display.\n */\n type: IconProps['type'];\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -17682,7 +18129,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -17690,7 +18137,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -17698,7 +18145,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -17706,11 +18153,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } } @@ -17895,15 +18342,31 @@ "Image": { "filePath": "src/surfaces/admin/components.ts", "name": "Image", - "description": "Configure the following properties on the image component.", - "isPublicDocs": true, + "description": "An image displays pictures with configurable sizing, loading behavior, and borders.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"img\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The accessibility role for the image.", "defaultValue": "'img'", "isOptional": true }, @@ -17921,8 +18384,8 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``", + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`", "isOptional": true }, { @@ -17930,7 +18393,7 @@ "syntaxKind": "PropertyDeclaration", "name": "aspectRatio", "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", - "description": "The aspect ratio of the image.\n\nThe rendering of the image will depend on the `inlineSize` value:\n\n- `inlineSize=\"fill\"`: the aspect ratio will be respected and the image will take the necessary space.\n- `inlineSize=\"auto\"`: the image will not render until it has loaded and the aspect ratio will be ignored.\n\nFor example, if the value is set as `50 / 100`, the getter returns `50 / 100`. If the value is set as `0.5`, the getter returns `0.5 / 1`.\n\nLearn more about the [aspect-ratio property](https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio).", + "description": "The aspect ratio of the image as a width-to-height ratio.", "defaultValue": "'1/1'", "isOptional": true }, @@ -17948,20 +18411,8 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied around the image using shorthand syntax to specify width, color, and style in a single property.", + "description": "Whether to show a border around the image.", "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ], "isOptional": true }, { @@ -17969,7 +18420,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "The color of the border around the image.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -17977,8 +18428,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the image's corners using the design system's radius scale.", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image.", "defaultValue": "'none'", "isOptional": true }, @@ -17986,8 +18437,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderStyle", - "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -17995,8 +18446,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderWidth", - "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -18005,7 +18456,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -18032,7 +18483,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "\"auto\" | \"fill\"", - "description": "The displayed inline width of the image.\n\n- `fill`: the image will takes up 100% of the available inline size.\n- `auto`: the image will be displayed at its natural size.\n\nLearn more about the [width attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#width).", + "description": "The inline size (width in horizontal writing modes) of the image.", "defaultValue": "'fill'", "isOptional": true }, @@ -18041,7 +18492,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "\"eager\" | \"lazy\"", - "description": "The loading strategy for the image.\n\n- `eager`: Immediately loads the image, irrespective of its position within the visible viewport.\n- `lazy`: Delays loading the image until it approaches a specified distance from the viewport.\n\nLearn more about the [loading attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading).", + "description": "When the image should be loaded.", "defaultValue": "'eager'", "isOptional": true }, @@ -18050,7 +18501,7 @@ "syntaxKind": "PropertyDeclaration", "name": "objectFit", "value": "\"contain\" | \"cover\"", - "description": "The image resizing behavior to fit within its container.\n\n- `contain`: Scales the image to fit within the container while maintaining its aspect ratio. The entire image is visible, but might leave empty space.\n- `cover`: Scales the image to fill the entire container while maintaining its aspect ratio. The image might be cropped to fit.\n\nThe image is always positioned in the center of the container.\n\nLearn more about the [object-fit property](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).", + "description": "How the image should be resized to fit its container.", "defaultValue": "'contain'", "isOptional": true }, @@ -18059,7 +18510,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -18077,7 +18528,7 @@ "syntaxKind": "PropertyDeclaration", "name": "sizes", "value": "string", - "description": "A set of media conditions and their corresponding sizes.\n\nLearn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes).", + "description": "The sizes of the image at different viewport widths.", "isOptional": true }, { @@ -18085,7 +18536,7 @@ "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered.", + "description": "The URL of the image to display.", "isOptional": true }, { @@ -18093,81 +18544,73 @@ "syntaxKind": "PropertyDeclaration", "name": "srcSet", "value": "string", - "description": "A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n\nLearn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset).", + "description": "A set of source images with different sizes for responsive loading.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", "isOptional": true } ], - "value": "declare class Image extends PreactCustomElement implements ImageProps {\n accessor src: ImageProps['src'];\n accessor srcSet: ImageProps['srcSet'];\n accessor sizes: ImageProps['sizes'];\n accessor alt: ImageProps['alt'];\n accessor aspectRatio: ImageProps['aspectRatio'];\n accessor objectFit: ImageProps['objectFit'];\n accessor loading: ImageProps['loading'];\n accessor accessibilityRole: ImageProps['accessibilityRole'];\n accessor inlineSize: ImageProps['inlineSize'];\n /**\n * A border applied around the image using shorthand syntax to specify width, color, and style in a single property.\n */\n accessor border: ImageProps['border'];\n /**\n * The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.\n */\n accessor borderWidth: ImageProps['borderWidth'];\n /**\n * The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.\n */\n accessor borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.\n */\n accessor borderColor: ImageProps['borderColor'];\n /**\n * The roundedness of the image's corners using the design system's radius scale.\n */\n accessor borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + "value": "declare class Image extends PolarisCustomElement implements ImageProps {\n /**\n * The URL of the image to display.\n */\n src: ImageProps['src'];\n /**\n * A set of source images with different sizes for responsive loading.\n */\n srcSet: ImageProps['srcSet'];\n /**\n * The sizes of the image at different viewport widths.\n */\n sizes: ImageProps['sizes'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ImageProps['alt'];\n /**\n * The aspect ratio of the image as a width-to-height ratio.\n */\n aspectRatio: ImageProps['aspectRatio'];\n /**\n * How the image should be resized to fit its container.\n */\n objectFit: ImageProps['objectFit'];\n /**\n * When the image should be loaded.\n */\n loading: ImageProps['loading'];\n /**\n * The accessibility role for the image.\n */\n accessibilityRole: ImageProps['accessibilityRole'];\n /**\n * The inline size (width in horizontal writing modes) of the image.\n */\n inlineSize: ImageProps['inlineSize'];\n /**\n * Whether to show a border around the image.\n */\n border: ImageProps['border'];\n /**\n * The width of the border around the image.\n */\n borderWidth: ImageProps['borderWidth'];\n /**\n * The style of the border around the image.\n */\n borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image.\n */\n borderColor: ImageProps['borderColor'];\n /**\n * The radius of the border corners around the image.\n */\n borderRadius: ImageProps['borderRadius'];\n constructor();\n}" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true - }, - "BoxBorderStyles": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "BoxBorderStyles", - "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", - "isPublicDocs": true + "description": "" }, - "BoxBorderRadii": { + "BorderRadiusKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", - "name": "BoxBorderRadii", - "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", - "isPublicDocs": true + "name": "BorderRadiusKeyword", + "value": "SizeKeyword | 'max' | 'none'", + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -18190,7 +18633,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -18198,7 +18641,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -18206,7 +18649,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -18214,11 +18657,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -18230,15 +18673,14 @@ "ImageEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ImageEvents", - "description": "The image component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "error", "value": "OnErrorEventHandler", - "description": "A callback fired when the image fails to load.\n\nLearn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).", + "description": "A callback that's fired when the image fails to load.", "isOptional": true }, { @@ -18246,27 +18688,25 @@ "syntaxKind": "PropertySignature", "name": "load", "value": "CallbackEventListener | null", - "description": "A callback fired when the image successfully loads.\n\nLearn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).", + "description": "A callback that's fired when the image has loaded successfully.", "isOptional": true } ], - "value": "export interface ImageEvents {\n /**\n * A callback fired when the image successfully loads.\n *\n * Learn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback fired when the image fails to load.\n *\n * Learn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).\n */\n error: OnErrorEventHandler = null;\n}" + "value": "export interface ImageEvents {\n /**\n * A callback that's fired when the image has loaded successfully.\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback that's fired when the image fails to load.\n */\n error: OnErrorEventHandler = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -18417,15 +18857,31 @@ "Link": { "filePath": "src/surfaces/admin/components.ts", "name": "Link", - "description": "Configure the following properties on the link component.", - "isPublicDocs": true, + "description": "", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies.", "isOptional": true }, { @@ -18451,7 +18907,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -18460,7 +18916,7 @@ "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'", "isOptional": true }, @@ -18469,7 +18925,7 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated.", + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated.", "isOptional": true }, { @@ -18495,7 +18951,7 @@ "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", "isOptional": true }, { @@ -18503,7 +18959,7 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { @@ -18511,7 +18967,7 @@ "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated.", "isOptional": true }, { @@ -18519,7 +18975,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lang", "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry).", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", "isOptional": true }, { @@ -18527,7 +18983,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -18545,7 +19001,7 @@ "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'", "isOptional": true }, @@ -18554,26 +19010,32 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", "defaultValue": "'auto'", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Link extends Link_base implements LinkProps {\n accessor tone: LinkProps['tone'];\n accessor accessibilityLabel: LinkProps['accessibilityLabel'];\n accessor href: LinkProps['href'];\n accessor target: LinkProps['target'];\n accessor download: LinkProps['download'];\n accessor lang: LinkProps['lang'];\n constructor();\n}" + "value": "declare class Link extends LinkBase implements LinkProps {\n tone: LinkProps['tone'];\n constructor();\n}" }, "AnyString": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AnyString", "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true + "description": "Prevents widening string literal types in a union to `string`." }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -18596,7 +19058,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -18604,7 +19066,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -18612,7 +19074,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -18620,11 +19082,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -18636,35 +19098,32 @@ "LinkEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "LinkEvents", - "description": "The link component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "click", - "value": "CallbackEventListener | null", - "description": "A callback fired when the link is clicked.\n\nLearn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", + "value": "CallbackEventListener | null", + "description": "", "isOptional": true } ], - "value": "export interface LinkEvents {\n /**\n * A callback fired when the link is clicked.\n *\n * Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n click: CallbackEventListener | null = null;\n}" + "value": "export interface LinkEvents {\n click: CallbackEventListener | null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -18676,19 +19135,18 @@ "LinkSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "LinkSlots", - "description": "The link component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The text or elements displayed within the link component, which navigates users to a different location when activated.", + "description": "The text or content to display inside the link. This typically describes the destination or action the link performs.", "isOptional": true } ], - "value": "export interface LinkSlots {\n /**\n * The text or elements displayed within the link component, which navigates users to a different location when activated.\n */\n children?: HTMLElement;\n}" + "value": "export interface LinkSlots {\n /**\n * The text or content to display inside the link. This typically describes the destination or action the link performs.\n */\n children?: HTMLElement;\n}" } } } @@ -18873,13 +19331,20 @@ "Menu": { "filePath": "src/surfaces/admin/components.ts", "name": "Menu", - "description": "Configure the following properties on the menu component.", - "isPublicDocs": true, + "description": "A component that displays a contextual list of actions or options, which is typically triggered by a button or other activator element.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@16327", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true, @@ -18888,7 +19353,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@16326", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true, @@ -18897,18 +19362,27 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@16328", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the menu for assistive technologies.", "isOptional": true }, { @@ -18934,7 +19408,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -18961,7 +19435,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -18973,15 +19447,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n accessor accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n /**\n * A label that describes the menu for assistive technologies.\n */\n accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -19004,7 +19485,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -19012,7 +19493,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -19020,7 +19501,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -19028,11 +19509,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -19044,19 +19525,18 @@ "MenuSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "MenuSlots", - "description": "The menu component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The items displayed within the menu. Only accepts button and section components. Use button for individual menu actions and section to group related items.", + "description": "The menu items to display, which should include button and section components.", "isOptional": true } ], - "value": "export interface MenuSlots {\n /**\n * The items displayed within the menu. Only accepts button and section components. Use button for individual menu actions and section to group related items.\n */\n children?: HTMLElement;\n}" + "value": "export interface MenuSlots {\n /**\n * The menu items to display, which should include button and section components.\n */\n children?: HTMLElement;\n}" } } } @@ -19219,13 +19699,12 @@ "Modal": { "filePath": "src/surfaces/admin/components.ts", "name": "Modal", - "description": "Configure the following properties on the modal component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@abortController@16386", + "name": "__@abortController@17154", "value": "AbortController", "description": "", "isPrivate": true, @@ -19234,7 +19713,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@childrenRerenderObserver@16388", + "name": "__@childrenRerenderObserver@17156", "value": "MutationObserver", "description": "", "isPrivate": true, @@ -19243,7 +19722,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@dialog@16380", + "name": "__@dialog@17146", "value": "HTMLDialogElement", "description": "", "isPrivate": true, @@ -19252,25 +19731,51 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@dismiss@16381", + "name": "__@dismiss@17147", "value": "() => void", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@ensureDialogRef@17159", + "value": "() => void", + "description": "Ensures `this[dialog]` is set by synchronously querying the shadow DOM and attaching event listeners if needed. Works around a Safari timing issue where the MutationObserver callback (which normally sets `this[dialog]`) may not have fired yet when `show()` / `dismiss()` run — especially when `heading` or `accessibilityLabel` adds child custom-elements whose own lifecycle microtasks can delay the observer.", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@focusedElement@16382", + "name": "__@focusedElement@17148", "value": "HTMLElement", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@focusTrapHandler@17158", + "value": "(event: KeyboardEvent) => void", + "description": "Focus trap keydown handler reference, stored for cleanup.\n\nThe focus trap is managed imperatively here in ModalBase rather than via a Preact useEffect in foundation.tsx. This is because aftershow (fired after CSS animations complete) and useEffect (fired after Preact's async effect scheduling) are independent async chains with no synchronization — the useEffect could run before or after aftershow, making tests non-deterministic.\n\nBy attaching the focus trap in the same .then() chain as aftershow, we guarantee it is active before aftershow dispatches.\n\nLifecycle (mirrors the old useEffect's isActiveModal dependency):\n- Attached: in aftershow chain, right before aftershow dispatches\n- Detached: on dismiss(), disconnectedCallback(), or child modal open\n- Re-attached: when all child modals close", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", - "name": "__@hasOpenChildModal@16376", + "name": "__@hasOpenChildModal@17142", "value": "boolean", "description": "", "isPrivate": true, @@ -19279,7 +19784,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@hide@16378", + "name": "__@hide@17144", "value": "() => Promise", "description": "", "isPrivate": true, @@ -19288,7 +19793,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", - "name": "__@isOpen@16379", + "name": "__@isOpen@17145", "value": "boolean", "description": "", "isPrivate": true, @@ -19297,8 +19802,8 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@nestedModals@16384", - "value": "Map", + "name": "__@nestedModals@17151", + "value": "Map, boolean>", "description": "", "isPrivate": true, "isOptional": true @@ -19306,7 +19811,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@onBackdropClick@16385", + "name": "__@onBackdropClick@17153", "value": "(event: MouseEvent) => void", "description": "", "isPrivate": true, @@ -19315,8 +19820,387 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@onChildModalChange@16387", - "value": "EventListenerOrEventListenerObject", + "name": "__@onChildModalChange@17155", + "value": "EventListenerOrEventListenerObject", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@onEscape@17150", + "value": "(event: KeyboardEvent) => void", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@onKeyUp@17152", + "value": "(event: KeyboardEvent) => void", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@overlayActivator@17126", + "value": "HTMLElement", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@overlayHidden@17125", + "value": "boolean", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@overlayHideFrameId@17127", + "value": "number", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@rootActivator@17149", + "value": "HTMLElement", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowDomRerenderObserver@17157", + "value": "MutationObserver", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@show@17143", + "value": "() => Promise", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose of the modal. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nThis overrides the `heading` prop for screen readers.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "adoptedCallback", + "value": "() => void", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "alignSelf", + "value": "\"start\" | \"center\"", + "description": "Places the Modal on the block axis on a large screen", + "defaultValue": "'center'", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "attributeChangedCallback", + "value": "(name: string) => void", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "click", + "value": "({ sourceEvent }?: ClickOptions) => void", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "connectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "heading", + "value": "string", + "description": "A title that describes the content of the Modal.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "hideOverlay", + "value": "({ force }?: { force?: boolean; }) => void", + "description": "Method to hide an overlay.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "padding", + "value": "\"base\" | \"none\"", + "description": "Adjust the padding around the Modal content.\n\n`base`: applies padding that is appropriate for the element.\n\n`none`: removes all padding from the element. This can be useful when elements inside the Modal need to span to the edge of the Modal. For example, a full-width image. In this case, rely on `Box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "defaultValue": "'base'", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "queueRender", + "value": "() => void", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "setAttribute", + "value": "(name: string, value: string) => void", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "showOverlay", + "value": "() => void", + "description": "Method to show an overlay.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "size", + "value": "\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", + "description": "Adjust the size of the Modal.", + "defaultValue": "'base'", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "toggleOverlay", + "value": "() => void", + "description": "Method to toggle the visiblity of an overlay.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + } + ], + "value": "declare class Modal extends ModalBase implements ModalProps {\n constructor();\n}" + }, + "ModalBase": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ModalBase", + "description": "", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@abortController@17154", + "value": "AbortController", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@childrenRerenderObserver@17156", + "value": "MutationObserver", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@dialog@17146", + "value": "HTMLDialogElement", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@dismiss@17147", + "value": "() => void", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@ensureDialogRef@17159", + "value": "() => void", + "description": "Ensures `this[dialog]` is set by synchronously querying the shadow DOM and attaching event listeners if needed. Works around a Safari timing issue where the MutationObserver callback (which normally sets `this[dialog]`) may not have fired yet when `show()` / `dismiss()` run — especially when `heading` or `accessibilityLabel` adds child custom-elements whose own lifecycle microtasks can delay the observer.", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@focusedElement@17148", + "value": "HTMLElement", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@focusTrapHandler@17158", + "value": "(event: KeyboardEvent) => void", + "description": "Focus trap keydown handler reference, stored for cleanup.\n\nThe focus trap is managed imperatively here in ModalBase rather than via a Preact useEffect in foundation.tsx. This is because aftershow (fired after CSS animations complete) and useEffect (fired after Preact's async effect scheduling) are independent async chains with no synchronization — the useEffect could run before or after aftershow, making tests non-deterministic.\n\nBy attaching the focus trap in the same .then() chain as aftershow, we guarantee it is active before aftershow dispatches.\n\nLifecycle (mirrors the old useEffect's isActiveModal dependency):\n- Attached: in aftershow chain, right before aftershow dispatches\n- Detached: on dismiss(), disconnectedCallback(), or child modal open\n- Re-attached: when all child modals close", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "__@hasOpenChildModal@17142", + "value": "boolean", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@hide@17144", + "value": "() => Promise", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "__@isOpen@17145", + "value": "boolean", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@nestedModals@17151", + "value": "Map, boolean>", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@onBackdropClick@17153", + "value": "(event: MouseEvent) => void", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@onChildModalChange@17155", + "value": "EventListenerOrEventListenerObject", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@onEscape@17150", + "value": "(event: KeyboardEvent) => void", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@onKeyUp@17152", + "value": "(event: KeyboardEvent) => void", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@overlayActivator@17126", + "value": "HTMLElement", "description": "", "isPrivate": true, "isOptional": true @@ -19324,8 +20208,8 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@onEscape@16383", - "value": "(event: KeyboardEvent) => void", + "name": "__@overlayHidden@17125", + "value": "boolean", "description": "", "isPrivate": true, "isOptional": true @@ -19333,8 +20217,8 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@16327", - "value": "HTMLElement", + "name": "__@overlayHideFrameId@17127", + "value": "number", "description": "", "isPrivate": true, "isOptional": true @@ -19342,8 +20226,8 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@16326", - "value": "boolean", + "name": "__@rootActivator@17149", + "value": "HTMLElement", "description": "", "isPrivate": true, "isOptional": true @@ -19351,8 +20235,8 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@16328", - "value": "number", + "name": "__@shadowDomRerenderObserver@17157", + "value": "MutationObserver", "description": "", "isPrivate": true, "isOptional": true @@ -19360,8 +20244,8 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@shadowDomRerenderObserver@16389", - "value": "MutationObserver", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", "description": "", "isPrivate": true, "isOptional": true @@ -19369,7 +20253,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@show@16377", + "name": "__@show@17143", "value": "() => Promise", "description": "", "isPrivate": true, @@ -19392,6 +20276,15 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "alignSelf", + "value": "\"start\" | \"center\"", + "description": "", + "defaultValue": "'center'", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -19406,7 +20299,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -19433,15 +20326,15 @@ "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "A title that describes the content of the modal.", + "description": "A title that describes the content of the Modal.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", "name": "hideOverlay", - "value": "() => void", - "description": "A method to programmatically hide the overlay.", + "value": "({ force }?: { force?: boolean; }) => void", + "description": "", "isOptional": true }, { @@ -19449,7 +20342,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "\"base\" | \"none\"", - "description": "Adjust the padding around the modal content.\n\n`base`: applies padding that is appropriate for the element.\n\n`none`: removes all padding from the element. This can be useful when elements inside the modal need to span to the edge of the modal. For example, a full-width image. In this case, rely on box with a padding of 'base' to bring back the desired padding for the rest of the content.", + "description": "Adjust the padding around the Modal content.\n\n`base`: applies padding that is appropriate for the element.\n\n`none`: removes all padding from the element. This can be useful when elements inside the Modal need to span to the edge of the Modal. For example, a full-width image. In this case, rely on `Box` with a padding of 'base' to bring back the desired padding for the rest of the content.", "defaultValue": "'base'", "isOptional": true }, @@ -19458,7 +20351,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -19476,7 +20369,7 @@ "syntaxKind": "MethodDeclaration", "name": "showOverlay", "value": "() => void", - "description": "A method to programmatically show the overlay.", + "description": "", "isOptional": true }, { @@ -19484,7 +20377,7 @@ "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the modal component, controlling its width and height. Larger sizes provide more space for content while smaller sizes are more compact.", + "description": "Adjust the size of the Modal.", "defaultValue": "'base'", "isOptional": true }, @@ -19493,17 +20386,24 @@ "syntaxKind": "MethodDeclaration", "name": "toggleOverlay", "value": "() => void", - "description": "A method to programmatically toggle the visibility of the overlay.", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", "isOptional": true } ], - "value": "declare class Modal extends PreactOverlayElement implements ModalProps {\n accessor accessibilityLabel: ModalProps['accessibilityLabel'];\n accessor heading: ModalProps['heading'];\n accessor padding: ModalProps['padding'];\n accessor size: ModalProps['size'];\n /** @private */\n [abortController]: AbortController;\n /** @private */\n [dialog]: HTMLDialogElement | null;\n /** @private */\n [focusedElement]: HTMLElement | null;\n /** @private */\n [nestedModals]: Map;\n /** @private */\n [childrenRerenderObserver]: MutationObserver;\n /** @private */\n [shadowDomRerenderObserver]: MutationObserver;\n /** @private */\n [onEscape]: (event: KeyboardEvent) => void;\n /** @private */\n [onBackdropClick]: (event: MouseEvent) => void;\n /** @private */\n [onChildModalChange]: EventListenerOrEventListenerObject;\n /** @private */\n get [isOpen](): boolean;\n /** @private */\n [dismiss](): void;\n /** @private */\n get [hasOpenChildModal](): boolean;\n /** @private */\n [show](): Promise;\n /** @private */\n [hide](): Promise;\n showOverlay(): void;\n hideOverlay(): void;\n toggleOverlay(): void;\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n constructor();\n}" + "value": "declare abstract class ModalBase\n extends PreactOverlayElement\n implements\n Pick\n{\n accessibilityLabel: ModalProps['accessibilityLabel'];\n heading: ModalProps['heading'];\n padding: ModalProps['padding'];\n size: ModalProps['size'];\n alignSelf: ModalProps['alignSelf'];\n /** @private */\n [abortController]: AbortController;\n /** @private */\n [dialog]: HTMLDialogElement | null;\n /** @private */\n [focusedElement]: HTMLElement | null;\n /** @private */\n [rootActivator]: HTMLElement | null;\n /** @private */\n [nestedModals]: Map, boolean>;\n /** @private */\n [childrenRerenderObserver]: MutationObserver;\n /** @private */\n [shadowDomRerenderObserver]: MutationObserver;\n /**\n * Focus trap keydown handler reference, stored for cleanup.\n *\n * The focus trap is managed imperatively here in ModalBase rather than\n * via a Preact useEffect in foundation.tsx. This is because aftershow\n * (fired after CSS animations complete) and useEffect (fired after\n * Preact's async effect scheduling) are independent async chains with\n * no synchronization — the useEffect could run before or after\n * aftershow, making tests non-deterministic.\n *\n * By attaching the focus trap in the same .then() chain as aftershow,\n * we guarantee it is active before aftershow dispatches.\n *\n * Lifecycle (mirrors the old useEffect's isActiveModal dependency):\n * - Attached: in aftershow chain, right before aftershow dispatches\n * - Detached: on dismiss(), disconnectedCallback(), or child modal open\n * - Re-attached: when all child modals close\n * @private\n */\n [focusTrapHandler]: ((event: KeyboardEvent) => void) | null;\n /** @private */\n [onEscape]: (event: KeyboardEvent) => void;\n /** @private */\n [onKeyUp]: (event: KeyboardEvent) => void;\n /** @private */\n [onBackdropClick]: (event: MouseEvent) => void;\n /** @private */\n [onChildModalChange]: EventListenerOrEventListenerObject;\n /**\n * Ensures `this[dialog]` is set by synchronously querying the shadow DOM\n * and attaching event listeners if needed.\n * Works around a Safari timing issue where the MutationObserver callback\n * (which normally sets `this[dialog]`) may not have fired yet when\n * `show()` / `dismiss()` run — especially when `heading` or\n * `accessibilityLabel` adds child custom-elements whose own lifecycle\n * microtasks can delay the observer.\n * @private\n */\n [ensureDialogRef](): void;\n /** @private */\n get [isOpen](): boolean;\n /** @private */\n [dismiss](): void;\n /** @private */\n get [hasOpenChildModal](): boolean;\n /** @private */\n [show](): Promise;\n /** @private */\n [hide](): Promise;\n showOverlay(): void;\n hideOverlay({force}?: {force?: boolean}): void;\n\n toggleOverlay(): void;\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n constructor(renderImpl: RenderImpl, tagName: string);\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -19526,7 +20426,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -19534,7 +20434,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -19542,7 +20442,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -19550,11 +20450,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -19566,59 +20466,56 @@ "ModalEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ModalEvents", - "description": "The modal component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "afterhide", - "value": "CallbackEventListener | null", - "description": "A callback fired after the modal is hidden.", + "value": "CallbackEventListener | null", + "description": "A callback fired after the modal has fully closed and any exit animation completes. Use to reset form state, clear temporary data, or update the page after dismissal.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "aftershow", - "value": "CallbackEventListener | null", - "description": "A callback fired after the modal is shown.", + "value": "CallbackEventListener | null", + "description": "A callback fired after the modal has fully opened and any entrance animation completes. Use to focus an input field or initialize content once the modal is visible.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "hide", - "value": "CallbackEventListener | null", - "description": "A callback fired when the modal is hidden.", + "value": "CallbackEventListener | null", + "description": "A callback fired when the modal closes. Use to perform cleanup or trigger side effects when the modal is dismissed.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "show", - "value": "CallbackEventListener | null", - "description": "A callback fired when the modal is shown.", + "value": "CallbackEventListener | null", + "description": "A callback fired when the modal starts to open, before any entrance animation begins. Use to prepare content or fetch data needed for the modal.", "isOptional": true } ], - "value": "export interface ModalEvents {\n /**\n * A callback fired when the modal is hidden.\n */\n hide: CallbackEventListener | null = null;\n /**\n * A callback fired when the modal is shown.\n */\n show: CallbackEventListener | null = null;\n /**\n * A callback fired after the modal is hidden.\n */\n afterhide: CallbackEventListener | null = null;\n /**\n * A callback fired after the modal is shown.\n */\n aftershow: CallbackEventListener | null = null;\n}" + "value": "export interface ModalEvents {\n /**\n * A callback fired when the modal closes.\n * Use to perform cleanup or trigger side effects when the modal is dismissed.\n */\n hide: CallbackEventListener | null;\n /**\n * A callback fired when the modal starts to open, before any entrance animation begins.\n * Use to prepare content or fetch data needed for the modal.\n */\n show: CallbackEventListener | null;\n /**\n * A callback fired after the modal has fully closed and any exit animation completes.\n * Use to reset form state, clear temporary data, or update the page after dismissal.\n */\n afterhide: CallbackEventListener | null;\n /**\n * A callback fired after the modal has fully opened and any entrance animation completes.\n * Use to focus an input field or initialize content once the modal is visible.\n */\n aftershow: CallbackEventListener | null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -19630,15 +20527,14 @@ "ModalSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ModalSlots", - "description": "The modal component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The content displayed within the modal component, typically including form fields, information, or interactive elements.", + "description": "The content of the Modal.", "isOptional": true }, { @@ -19646,7 +20542,7 @@ "syntaxKind": "PropertySignature", "name": "primary-action", "value": "HTMLElement", - "description": "The main action button displayed in the modal footer, representing the primary action users should take.\n\nOnly accepts a single button component with a `variant` of `primary`. This action should align with the modal's main purpose.", + "description": "The primary action to perform.\n\nOnly a `Button` with a variant of `primary` is allowed.", "isOptional": true }, { @@ -19654,11 +20550,11 @@ "syntaxKind": "PropertySignature", "name": "secondary-actions", "value": "HTMLElement", - "description": "Additional action buttons displayed in the modal footer, providing alternative or supporting actions.\n\nOnly accepts button components with a `variant` of `secondary` or `auto`. These are visually de-emphasized to establish clear hierarchy.", + "description": "The secondary actions to perform.\n\nOnly `Button` elements with a variant of `secondary` or `auto` are allowed.", "isOptional": true } ], - "value": "export interface ModalSlots {\n /**\n * The content displayed within the modal component, typically including form fields, information, or interactive elements.\n */\n children?: HTMLElement;\n /**\n * The main action button displayed in the modal footer, representing the primary action users should take.\n *\n * Only accepts a single button component with a `variant` of `primary`. This action should align with the modal's main purpose.\n */\n 'primary-action'?: HTMLElement;\n /**\n * Additional action buttons displayed in the modal footer, providing alternative or supporting actions.\n *\n * Only accepts button components with a `variant` of `secondary` or `auto`. These are visually de-emphasized to establish clear hierarchy.\n */\n 'secondary-actions'?: HTMLElement;\n}" + "value": "export interface ModalSlots {\n /**\n * The content of the Modal.\n */\n children?: HTMLElement;\n /**\n * The primary action to perform.\n *\n * Only a `Button` with a variant of `primary` is allowed.\n */\n 'primary-action'?: HTMLElement;\n /**\n * The secondary actions to perform.\n *\n * Only `Button` elements with a variant of `secondary` or `auto` are allowed.\n */\n 'secondary-actions'?: HTMLElement;\n}" } } } @@ -19860,18 +20756,34 @@ "MoneyField": { "filePath": "src/surfaces/admin/components.ts", "name": "MoneyField", - "description": "Configure the following properties on the money field component.", - "isPublicDocs": true, + "description": "The money field custom element class that renders a monetary input field in the Shopify admin interface. This component allows merchants to enter currency amounts with automatic formatting, decimal precision, and validation against minimum and maximum values.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@15957", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -19895,7 +20807,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "string", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else", "isOptional": true }, @@ -19904,7 +20816,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -19917,20 +20829,29 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "currencyCode", + "value": "\"auto\" | CurrencyCode", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "defaultValue": "'auto'", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -19938,7 +20859,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -19955,8 +20876,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -19991,7 +20912,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -19999,7 +20920,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -20007,8 +20928,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -20016,7 +20937,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -20025,7 +20946,7 @@ "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum monetary value allowed in the field.", "defaultValue": "Infinity", "isOptional": true }, @@ -20034,7 +20955,7 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum monetary value allowed in the field.", "defaultValue": "-Infinity", "isOptional": true }, @@ -20043,7 +20964,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -20051,7 +20972,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -20059,7 +20980,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -20068,7 +20989,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -20077,7 +20998,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -20090,6 +21011,14 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -20099,13 +21028,19 @@ "isOptional": true } ], - "value": "declare class MoneyField\n extends PreactFieldElement\n implements MoneyFieldProps\n{\n accessor max: MoneyFieldProps['max'];\n accessor min: MoneyFieldProps['min'];\n /**\n * The current monetary value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string representing the amount in the store's currency.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class MoneyField extends MoneyFieldBase implements MoneyFieldProps {\n constructor();\n}" + }, + "CurrencyCode": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CurrencyCode", + "value": "'USD' | 'EUR' | 'GBP' | 'CAD' | 'AFN' | 'ALL' | 'DZD' | 'AOA' | 'ARS' | 'AMD' | 'AWG' | 'AUD' | 'BBD' | 'AZN' | 'BDT' | 'BSD' | 'BHD' | 'BIF' | 'BZD' | 'BMD' | 'BTN' | 'BAM' | 'BRL' | 'BOB' | 'BWP' | 'BND' | 'BGN' | 'MMK' | 'KHR' | 'CVE' | 'KYD' | 'XAF' | 'CLP' | 'CNY' | 'COP' | 'KMF' | 'CDF' | 'CRC' | 'HRK' | 'CZK' | 'DKK' | 'DOP' | 'XCD' | 'EGP' | 'ETB' | 'XPF' | 'FJD' | 'GMD' | 'GHS' | 'GTQ' | 'GYD' | 'GEL' | 'HTG' | 'HNL' | 'HKD' | 'HUF' | 'ISK' | 'INR' | 'IDR' | 'ILS' | 'IQD' | 'JMD' | 'JPY' | 'JEP' | 'JOD' | 'KZT' | 'KES' | 'KWD' | 'KGS' | 'LAK' | 'LVL' | 'LBP' | 'LSL' | 'LRD' | 'LTL' | 'MGA' | 'MKD' | 'MOP' | 'MWK' | 'MVR' | 'MXN' | 'MYR' | 'MUR' | 'MDL' | 'MAD' | 'MNT' | 'MZN' | 'NAD' | 'NPR' | 'ANG' | 'NZD' | 'NIO' | 'NGN' | 'NOK' | 'OMR' | 'PAB' | 'PKR' | 'PGK' | 'PYG' | 'PEN' | 'PHP' | 'PLN' | 'QAR' | 'RON' | 'RUB' | 'RWF' | 'WST' | 'SAR' | 'RSD' | 'SCR' | 'SGD' | 'SDG' | 'SYP' | 'ZAR' | 'KRW' | 'SSP' | 'SBD' | 'LKR' | 'SRD' | 'SZL' | 'SEK' | 'CHF' | 'TWD' | 'THB' | 'TZS' | 'TTD' | 'TND' | 'TRY' | 'TMT' | 'UGX' | 'UAH' | 'AED' | 'UYU' | 'UZS' | 'VUV' | 'VND' | 'XOF' | 'YER' | 'ZMW' | 'BYN' | 'BYR' | 'DJF' | 'ERN' | 'FKP' | 'GIP' | 'GNF' | 'IRR' | 'KID' | 'LYD' | 'MRU' | 'SLL' | 'SHP' | 'SOS' | 'STD' | 'STN' | 'TJS' | 'TOP' | 'VED' | 'VEF' | 'VES' | 'XXX'", + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -20128,7 +21063,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -20136,7 +21071,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -20144,7 +21079,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -20152,11 +21087,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -20168,15 +21103,14 @@ "MoneyFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "MoneyFieldEvents", - "description": "The money field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the money field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -20184,7 +21118,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the money field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -20192,7 +21126,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the money field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -20200,27 +21134,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the money field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface MoneyFieldEvents {\n /**\n * A callback fired when the money field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the money field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the money field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the money field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface MoneyFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -20336,18 +21268,34 @@ "NumberField": { "filePath": "src/surfaces/admin/components.ts", "name": "NumberField", - "description": "Configure the following properties on the number field component.", - "isPublicDocs": true, + "description": "The number field custom element class that renders a numeric input field in the Shopify admin interface. This component allows merchants to enter numbers with automatic validation and prefix/suffix display.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@15957", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -20371,7 +21319,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | NumberAutocompleteField | `section-${string} one-time-code` | `section-${string} cc-number` | `section-${string} cc-csc` | \"shipping one-time-code\" | \"shipping cc-number\" | \"shipping cc-csc\" | \"billing one-time-code\" | \"billing cc-number\" | \"billing cc-csc\" | `section-${string} shipping one-time-code` | `section-${string} shipping cc-number` | `section-${string} shipping cc-csc` | `section-${string} billing one-time-code` | `section-${string} billing cc-number` | `section-${string} billing cc-csc`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else", "isOptional": true }, @@ -20380,7 +21328,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -20398,15 +21346,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -20414,7 +21362,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -20431,8 +21379,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -20467,7 +21415,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -20475,7 +21423,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inputMode", "value": "\"decimal\" | \"numeric\"", - "description": "The type of virtual keyboard to display on mobile devices.\n\n- `decimal`: Shows a numeric keyboard with a decimal point, suitable for prices or measurements.\n- `numeric`: Shows a numeric keyboard without a decimal point, suitable for whole numbers like quantities.\n\nLearn more about the [inputmode attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode).", + "description": "The input mode hint for mobile keyboards. Available values include:\n- `numeric`: Shows a numeric keypad optimized for entering numbers\n- `decimal`: Shows a numeric keypad with decimal point support\n- `tel`: Shows a telephone keypad", "defaultValue": "'decimal'", "isOptional": true }, @@ -20484,7 +21432,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -20492,8 +21440,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -20501,7 +21449,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -20510,7 +21458,7 @@ "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum numeric value allowed in the field.", "defaultValue": "Infinity", "isOptional": true }, @@ -20519,7 +21467,7 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum numeric value allowed in the field.", "defaultValue": "-Infinity", "isOptional": true }, @@ -20528,7 +21476,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -20536,7 +21484,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -20544,7 +21492,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the user's input, such as a currency symbol.", "defaultValue": "''", "isOptional": true }, @@ -20553,7 +21501,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -20562,7 +21510,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -20571,7 +21519,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -20589,7 +21537,7 @@ "syntaxKind": "PropertyDeclaration", "name": "step", "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "description": "The granularity that the value must adhere to, or the keyword `any`. This controls the increment/decrement step size.", "defaultValue": "1", "isOptional": true }, @@ -20598,10 +21546,18 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the user's input, such as a unit of measurement.", "defaultValue": "''", "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -20611,21 +21567,19 @@ "isOptional": true } ], - "value": "declare class NumberField\n extends PreactFieldElement\n implements NumberFieldProps\n{\n /**\n * The current numeric value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string (decimal or integer).\n */\n get value(): string;\n set value(value: string);\n accessor inputMode: NumberFieldProps['inputMode'];\n accessor step: NumberFieldProps['step'];\n accessor max: NumberFieldProps['max'];\n accessor min: NumberFieldProps['min'];\n accessor prefix: NumberFieldProps['prefix'];\n accessor suffix: NumberFieldProps['suffix'];\n constructor();\n}" + "value": "declare class NumberField extends NumberFieldBase implements NumberFieldProps {\n constructor();\n}" }, "NumberAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "NumberAutocompleteField", "value": "'one-time-code' | 'cc-number' | 'cc-csc'", - "description": "Represents autocomplete values that are valid for number input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for numeric inputs.\n\nAvailable values:\n- `one-time-code` - One-time codes for authentication (OTP, 2FA codes)\n- `cc-number` - Credit card number\n- `cc-csc` - Credit card security code (CVV/CVC)", - "isPublicDocs": true + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -20648,7 +21602,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -20656,7 +21610,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -20664,7 +21618,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -20672,11 +21626,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -20688,15 +21642,14 @@ "NumberFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "NumberFieldEvents", - "description": "The number field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the number field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -20704,7 +21657,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the number field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -20712,7 +21665,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the number field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -20720,27 +21673,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the number field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface NumberFieldEvents {\n /**\n * A callback fired when the number field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the number field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the number field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the number field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface NumberFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -20857,19 +21808,18 @@ "OrderedListSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "OrderedListSlots", - "description": "The ordered list component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The list entries displayed within the ordered list, where each item is numbered sequentially. Only accepts list item components as children. Each list item represents a single numbered entry in the sequence.", + "description": "The items in the ordered list. Only list item components are accepted.", "isOptional": true } ], - "value": "export interface OrderedListSlots {\n /**\n * The list entries displayed within the ordered list, where each item is numbered sequentially. Only accepts list item components as children. Each list item represents a single numbered entry in the sequence.\n */\n children?: HTMLElement;\n}" + "value": "export interface OrderedListSlots {\n /**\n * The items in the ordered list. Only list item components are accepted.\n */\n children?: HTMLElement;\n}" } } }, @@ -20881,9 +21831,25 @@ "ListItem": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItem", - "description": "The list item component represents a single entry within an ordered list or unordered list. Use list item to structure individual points, steps, or items within a list, with each item automatically receiving appropriate list markers (bullets or numbers) from its parent list.\n\nList item must be used as a direct child of ordered list or unordered list components. Each list item can contain text, inline formatting, or other components to create rich list content.", - "isPublicDocs": true, + "description": "A component that represents a single item within an ordered list or unordered list.\n\nUse list item as a child of ordered list or unordered list to create properly structured and accessible list content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -20907,7 +21873,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -20934,7 +21900,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -20946,15 +21912,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class ListItem extends PreactCustomElement implements ListItemProps {\n constructor();\n}" + "value": "declare class ListItem extends PolarisCustomElement implements ListItemProps {\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -20977,7 +21950,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -20985,7 +21958,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -20993,7 +21966,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -21001,11 +21974,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -21017,19 +21990,18 @@ "ListItemSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItemSlots", - "description": "The list item component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The content displayed within the list item, which represents a single entry in an ordered or unordered list.", + "description": "The content to display inside the list item.", "isOptional": true } ], - "value": "export interface ListItemSlots {\n /**\n * The content displayed within the list item, which represents a single entry in an ordered or unordered list.\n */\n children?: HTMLElement;\n}" + "value": "export interface ListItemSlots {\n /**\n * The content to display inside the list item.\n */\n children?: HTMLElement;\n}" } } } @@ -21113,9 +22085,25 @@ "Page": { "filePath": "src/surfaces/admin/components.ts", "name": "Page", - "description": "Use as the outer wrapper of a page.", - "isPublicDocs": true, + "description": "", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -21139,7 +22127,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -21183,7 +22171,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -21195,15 +22183,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Page extends PreactCustomElement implements PageProps {\n accessor inlineSize: PageProps['inlineSize'];\n accessor heading: PageProps['heading'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Page extends PageBase implements PageProps {\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -21226,7 +22221,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -21234,7 +22229,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -21242,7 +22237,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -21250,11 +22245,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -21266,8 +22261,7 @@ "PageSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "PageSlots", - "description": "The page component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -21282,7 +22276,7 @@ "syntaxKind": "PropertySignature", "name": "breadcrumb-actions", "value": "HTMLElement", - "description": "The navigation back actions for the page.\n\nOnly accepts link components.", + "description": "Navigations back actions for the page.\n\nOnly accepts `Link` components.", "isOptional": true }, { @@ -21290,7 +22284,7 @@ "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The main page content displayed within the page component, which serves as the primary container for the page's information and interface elements.", + "description": "The content of the Page.", "isOptional": true }, { @@ -21298,7 +22292,7 @@ "syntaxKind": "PropertySignature", "name": "primary-action", "value": "HTMLElement", - "description": "The primary action for the page.\n\nOnly accepts a single button component with a `variant` of `primary`.", + "description": "The primary action for the page.\n\nOnly accepts a single `Button` component with a `variant` of `primary`.", "isOptional": true }, { @@ -21306,11 +22300,11 @@ "syntaxKind": "PropertySignature", "name": "secondary-actions", "value": "HTMLElement", - "description": "The secondary actions for the page.\n\nOnly accepts button group and button components with a `variant` of `secondary` or `auto`.", + "description": "Secondary actions for the page.\n\nOnly accepts `ButtonGroup` and `Button` components with a `variant` of `secondary` or `auto`.", "isOptional": true } ], - "value": "export interface PageSlots {\n /**\n * The main page content displayed within the page component, which serves as the primary container for the page's information and interface elements.\n */\n children?: HTMLElement;\n /**\n * The content to display in the aside section of the page.\n *\n * This slot is only rendered when `inlineSize` is \"base\".\n */\n aside?: HTMLElement;\n /**\n * The primary action for the page.\n *\n * Only accepts a single button component with a `variant` of `primary`.\n *\n */\n 'primary-action'?: HTMLElement;\n /**\n * The secondary actions for the page.\n *\n * Only accepts button group and button components with a `variant` of `secondary` or `auto`.\n */\n 'secondary-actions'?: HTMLElement;\n /**\n * The navigation back actions for the page.\n *\n * Only accepts link components.\n */\n 'breadcrumb-actions'?: HTMLElement;\n}" + "value": "export interface PageSlots {\n /**\n * The content of the Page.\n */\n children?: HTMLElement;\n /**\n * The content to display in the aside section of the page.\n *\n * This slot is only rendered when `inlineSize` is \"base\".\n */\n aside?: HTMLElement;\n /**\n * The primary action for the page.\n *\n * Only accepts a single `Button` component with a `variant` of `primary`.\n *\n */\n 'primary-action'?: HTMLElement;\n /**\n * Secondary actions for the page.\n *\n * Only accepts `ButtonGroup` and `Button` components with a `variant` of `secondary` or `auto`.\n */\n 'secondary-actions'?: HTMLElement;\n /**\n * Navigations back actions for the page.\n *\n * Only accepts `Link` components.\n */\n 'breadcrumb-actions'?: HTMLElement;\n}" } } } @@ -21496,15 +22490,31 @@ "Paragraph": { "filePath": "src/surfaces/admin/components.ts", "name": "Paragraph", - "description": "Configure the following properties on the paragraph component.", - "isPublicDocs": true, + "description": "A custom element for displaying blocks of text content with consistent spacing and styling for readable body copy. Use Paragraph to render longer text content with proper line height and spacing between paragraphs.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'", "isOptional": true }, @@ -21531,7 +22541,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -21540,7 +22550,7 @@ "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color of the paragraph text.", "defaultValue": "'base'", "isOptional": true }, @@ -21558,7 +22568,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''", "isOptional": true }, @@ -21576,8 +22586,8 @@ "syntaxKind": "PropertyDeclaration", "name": "fontVariantNumeric", "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", - "defaultValue": "'auto'", + "description": "The numeric font variant for the paragraph text.", + "defaultValue": "'auto' - inherit from the parent element", "isOptional": true }, { @@ -21585,7 +22595,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lineClamp", "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", "defaultValue": "Infinity - no truncation is applied", "isOptional": true }, @@ -21594,7 +22604,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -21611,19 +22621,26 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"caution\"", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Paragraph extends PreactCustomElement implements ParagraphProps {\n accessor fontVariantNumeric: ParagraphProps['fontVariantNumeric'];\n accessor lineClamp: ParagraphProps['lineClamp'];\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: ParagraphProps['tone'];\n\n accessor color: ParagraphProps['color'];\n accessor dir: ParagraphProps['dir'];\n accessor accessibilityVisibility: ParagraphProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Paragraph extends ParagraphBase implements ParagraphProps {\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: ParagraphProps['tone'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -21646,7 +22663,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -21654,7 +22671,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -21662,7 +22679,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -21670,11 +22687,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -21686,19 +22703,18 @@ "ParagraphSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ParagraphSlots", - "description": "The paragraph component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The paragraph text content displayed within the paragraph component, which presents a block of related text with appropriate styling.", + "description": "The content of the paragraph.", "isOptional": true } ], - "value": "export interface ParagraphSlots {\n /**\n * The paragraph text content displayed within the paragraph component, which presents a block of related text with appropriate styling.\n */\n children?: HTMLElement;\n}" + "value": "export interface ParagraphSlots {\n /**\n * The content of the paragraph.\n */\n children?: HTMLElement;\n}" } } } @@ -21866,18 +22882,34 @@ "PasswordField": { "filePath": "src/surfaces/admin/components.ts", "name": "PasswordField", - "description": "Configure the following properties on the password field component.", - "isPublicDocs": true, + "description": "The password field custom element class that renders a password input field in the Shopify admin interface. This component allows merchants to enter passwords securely with characters automatically masked for privacy.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@15957", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -21901,7 +22933,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | PasswordAutocompleteField | `section-${string} current-password` | `section-${string} new-password` | \"shipping current-password\" | \"shipping new-password\" | \"billing current-password\" | \"billing new-password\" | `section-${string} shipping current-password` | `section-${string} shipping new-password` | `section-${string} billing current-password` | `section-${string} billing new-password`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else", "isOptional": true }, @@ -21910,7 +22942,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -21928,15 +22960,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -21944,7 +22976,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -21961,8 +22993,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -21997,7 +23029,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -22005,7 +23037,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -22013,8 +23045,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -22022,7 +23054,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -22031,7 +23063,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the password.", "defaultValue": "Infinity", "isOptional": true }, @@ -22040,7 +23072,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the password.", "defaultValue": "0", "isOptional": true }, @@ -22049,7 +23081,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -22057,7 +23089,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -22065,7 +23097,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -22074,7 +23106,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -22083,7 +23115,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -22096,30 +23128,36 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security.", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true } ], - "value": "declare class PasswordField\n extends PreactFieldElement\n implements PasswordFieldProps\n{\n accessor maxLength: PasswordFieldProps['maxLength'];\n accessor minLength: PasswordFieldProps['minLength'];\n /**\n * The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class PasswordField\n extends PasswordFieldBase\n implements PasswordFieldProps\n{\n constructor();\n}" }, "PasswordAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PasswordAutocompleteField", "value": "'current-password' | 'new-password'", - "description": "Represents autocomplete values that are valid for password input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for password inputs.\n\nAvailable values:\n- `current-password` - Existing password for login or authentication\n- `new-password` - New password when creating an account or changing password", - "isPublicDocs": true + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -22142,7 +23180,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -22150,7 +23188,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -22158,7 +23196,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -22166,11 +23204,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -22182,15 +23220,14 @@ "PasswordFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "PasswordFieldEvents", - "description": "The password field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the password field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -22198,7 +23235,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the password field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -22206,7 +23243,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the password field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -22214,27 +23251,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the password field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface PasswordFieldEvents {\n /**\n * A callback fired when the password field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the password field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the password field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the password field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface PasswordFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -22390,13 +23425,20 @@ "Popover": { "filePath": "src/surfaces/admin/components.ts", "name": "Popover", - "description": "Configure the following properties on the popover component.", - "isPublicDocs": true, + "description": "", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@16327", + "name": "__@overlayActivator@17126", "value": "HTMLElement", "description": "", "isPrivate": true, @@ -22405,7 +23447,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@16326", + "name": "__@overlayHidden@17125", "value": "boolean", "description": "", "isPrivate": true, @@ -22414,12 +23456,21 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@16328", + "name": "__@overlayHideFrameId@17127", "value": "number", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -22443,7 +23494,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about the [block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", + "description": "Adjust the block size.", "defaultValue": "'auto'", "isOptional": true }, @@ -22452,7 +23503,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -22479,7 +23530,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The horizontal size of the element in standard layouts (width in left-to-right or right-to-left writing modes).\n\nInline size adjusts based on the writing direction: in horizontal layouts, it controls the width; in vertical layouts, it controls the height. This ensures consistent behavior across different text directions.\n\nLearn more about the [inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", + "description": "Adjust the inline size.", "defaultValue": "'auto'", "isOptional": true }, @@ -22488,7 +23539,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum vertical size of the element in standard layouts (max-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the block axis.\n\nLearn more about the [max-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "Adjust the maximum block size.", "defaultValue": "'none'", "isOptional": true }, @@ -22497,7 +23548,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum horizontal size of the element in standard layouts (max-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the inline axis.\n\nLearn more about the [max-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "Adjust the maximum inline size.", "defaultValue": "'none'", "isOptional": true }, @@ -22506,7 +23557,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum vertical size of the element in standard layouts (min-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the block axis.\n\nLearn more about the [min-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "Adjust the minimum block size.", "defaultValue": "'0'", "isOptional": true }, @@ -22515,7 +23566,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum horizontal size of the element in standard layouts (min-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the inline axis.\n\nLearn more about the [min-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "Adjust the minimum inline size.", "defaultValue": "'0'", "isOptional": true }, @@ -22524,7 +23575,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -22536,39 +23587,43 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Popover\n extends PreactPopoverElement\n implements PopoverProps\n{\n constructor();\n}" + "value": "declare class Popover\n extends PreactPopoverElement\n implements PopoverProps\n{\n constructor();\n}" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -22591,7 +23646,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -22599,7 +23654,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -22607,7 +23662,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -22615,11 +23670,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -22631,15 +23686,14 @@ "PopoverEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "PopoverEvents", - "description": "The popover component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "afterhide", "value": "CallbackEventListener | null", - "description": "A callback fired after the popover is hidden.", + "description": "A callback fired after the popover has fully hidden and any exit animation completes. Use to reset selections or update the trigger button state.", "isOptional": true }, { @@ -22647,7 +23701,7 @@ "syntaxKind": "PropertySignature", "name": "aftershow", "value": "CallbackEventListener | null", - "description": "A callback fired after the popover is shown.", + "description": "A callback fired after the popover has fully shown and any entrance animation completes. Use to focus an element inside the popover or announce content to screen readers.", "isOptional": true }, { @@ -22655,7 +23709,7 @@ "syntaxKind": "PropertySignature", "name": "aftertoggle", "value": "CallbackEventListener | null", - "description": "A callback fired after the popover is toggled.", + "description": "A callback fired after the popover visibility toggle completes and any animation finishes. Use for post-transition updates.", "isOptional": true }, { @@ -22663,7 +23717,7 @@ "syntaxKind": "PropertySignature", "name": "hide", "value": "CallbackEventListener | null", - "description": "A callback fired when the popover is hidden.", + "description": "A callback fired immediately when the popover starts to hide, before any exit animation. Use to perform cleanup or save state before the popover dismisses.", "isOptional": true }, { @@ -22671,7 +23725,7 @@ "syntaxKind": "PropertySignature", "name": "show", "value": "CallbackEventListener | null", - "description": "A callback fired when the popover is shown.", + "description": "A callback fired immediately when the popover starts to show, before any entrance animation. Use to prepare content or update positioning logic.", "isOptional": true }, { @@ -22679,27 +23733,25 @@ "syntaxKind": "PropertySignature", "name": "toggle", "value": "CallbackEventListener | null", - "description": "A callback fired when the popover is toggled.", + "description": "A callback fired when the popover visibility toggles. Use for unified open/close handling when you don't need separate show and hide logic.", "isOptional": true } ], - "value": "export interface PopoverEvents {\n /**\n * A callback fired when the popover is shown.\n */\n show: CallbackEventListener | null;\n /**\n * A callback fired when the popover is hidden.\n */\n hide: CallbackEventListener | null;\n /**\n * A callback fired after the popover is shown.\n */\n aftershow: CallbackEventListener | null;\n /**\n * A callback fired after the popover is hidden.\n */\n afterhide: CallbackEventListener | null;\n /**\n * A callback fired when the popover is toggled.\n */\n toggle: CallbackEventListener | null;\n /**\n * A callback fired after the popover is toggled.\n */\n aftertoggle: CallbackEventListener | null;\n}" + "value": "export interface PopoverEvents {\n /**\n * A callback fired immediately when the popover starts to show, before any entrance animation.\n * Use to prepare content or update positioning logic.\n */\n show: CallbackEventListener | null;\n /**\n * A callback fired immediately when the popover starts to hide, before any exit animation.\n * Use to perform cleanup or save state before the popover dismisses.\n */\n hide: CallbackEventListener | null;\n /**\n * A callback fired after the popover has fully shown and any entrance animation completes.\n * Use to focus an element inside the popover or announce content to screen readers.\n */\n aftershow: CallbackEventListener | null;\n /**\n * A callback fired after the popover has fully hidden and any exit animation completes.\n * Use to reset selections or update the trigger button state.\n */\n afterhide: CallbackEventListener | null;\n /**\n * A callback fired when the popover visibility toggles. Use for unified open/close\n * handling when you don't need separate show and hide logic.\n */\n toggle: CallbackEventListener | null;\n /**\n * A callback fired after the popover visibility toggle completes and any animation finishes.\n * Use for post-transition updates.\n */\n aftertoggle: CallbackEventListener | null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -22711,19 +23763,18 @@ "PopoverSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "PopoverSlots", - "description": "The popover component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The content displayed within the popover component, which appears in an overlay positioned relative to its trigger element.", + "description": "The content displayed within the popover, which appears in an overlay positioned relative to its trigger element. Typically contains menus, action lists, or supplementary information.", "isOptional": true } ], - "value": "export interface PopoverSlots {\n /**\n * The content displayed within the popover component, which appears in an overlay positioned relative to its trigger element.\n */\n children?: HTMLElement;\n}" + "value": "export interface PopoverSlots {\n /**\n * The content displayed within the popover, which appears in an overlay positioned relative\n * to its trigger element. Typically contains menus, action lists, or supplementary information.\n */\n children?: HTMLElement;\n}" } } } @@ -22876,9 +23927,25 @@ "QueryContainer": { "filePath": "src/surfaces/admin/components.ts", "name": "QueryContainer", - "description": "Configure the following properties on the query container component.", - "isPublicDocs": true, + "description": "A component that sets up a container query context, which lets child elements style themselves based on the container's size instead of the viewport size.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -22902,7 +23969,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -22920,7 +23987,7 @@ "syntaxKind": "PropertyDeclaration", "name": "containerName", "value": "string", - "description": "An identifier for this container that you can reference in CSS container queries to apply styles based on this specific container's size.\n\nAll query container components automatically receive a container name of `s-default`. You can omit the container name in your queries, so `@container (inline-size <= 300px)` is equivalent to `@container s-default (inline-size <= 300px)`.\n\nWhen you provide a custom `containerName`, it's added alongside `s-default`. For example, `containerName=\"product-card\"` results in `s-default product-card` being set on the `container-name` CSS property, allowing you to target this container with `@container product-card (inline-size <= 300px)`.\n\nLearn more about the [container-name property](https://developer.mozilla.org/en-US/docs/Web/CSS/container-name).", + "description": "The name of the container, which you can reference in CSS container queries.", "defaultValue": "''", "isOptional": true }, @@ -22938,7 +24005,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -22950,15 +24017,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class QueryContainer\n extends PreactCustomElement\n implements QueryContainerProps\n{\n accessor containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" + "value": "declare class QueryContainer\n extends PolarisCustomElement\n implements QueryContainerProps\n{\n /**\n * The name of the container, which you can reference in CSS container queries.\n */\n containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -22981,7 +24055,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -22989,7 +24063,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -22997,7 +24071,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -23005,11 +24079,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -23021,19 +24095,18 @@ "QueryContainerSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "QueryContainerSlots", - "description": "The query container component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The content displayed within the query container component, which enables container queries for responsive styling based on the container's size rather than the viewport.", + "description": "The content to display inside the container.", "isOptional": true } ], - "value": "export interface QueryContainerSlots {\n /**\n * The content displayed within the query container component, which enables container queries for responsive styling based on the container's size rather than the viewport.\n */\n children?: HTMLElement;\n}" + "value": "export interface QueryContainerSlots {\n /**\n * The content to display inside the container.\n */\n children?: HTMLElement;\n}" } } } @@ -23110,18 +24183,34 @@ "SearchField": { "filePath": "src/surfaces/admin/components.ts", "name": "SearchField", - "description": "Configure the following properties on the search field component.", - "isPublicDocs": true, + "description": "A search field that lets users enter search queries with a search-specific input type.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@15957", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -23144,8 +24233,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else", "isOptional": true }, @@ -23154,7 +24243,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -23172,15 +24261,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -23188,7 +24277,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -23205,8 +24294,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -23241,7 +24330,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -23249,7 +24338,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -23257,8 +24346,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -23266,7 +24355,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -23275,7 +24364,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters that can be entered in the field.", "defaultValue": "Infinity", "isOptional": true }, @@ -23284,7 +24373,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters that must be entered for the field to be valid.", "defaultValue": "0", "isOptional": true }, @@ -23293,7 +24382,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -23301,7 +24390,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -23309,7 +24398,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -23318,7 +24407,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -23327,7 +24416,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -23340,30 +24429,36 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true } ], - "value": "declare class SearchField\n extends PreactFieldElement\n implements SearchFieldProps\n{\n accessor maxLength: SearchFieldProps['maxLength'];\n accessor minLength: SearchFieldProps['minLength'];\n /**\n * The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class SearchField extends SearchFieldBase implements SearchFieldProps {\n constructor();\n}" }, "TextAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -23386,7 +24481,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -23394,7 +24489,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -23402,7 +24497,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -23410,11 +24505,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -23426,15 +24521,14 @@ "SearchFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "SearchFieldEvents", - "description": "The search field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the search field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -23442,7 +24536,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the search field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -23450,7 +24544,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the search field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -23458,27 +24552,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the search field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface SearchFieldEvents {\n /**\n * A callback fired when the search field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the search field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the search field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the search field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface SearchFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -23595,15 +24687,31 @@ "Section": { "filePath": "src/surfaces/admin/components.ts", "name": "Section", - "description": "Configure the following properties on the section component.", - "isPublicDocs": true, + "description": "A section is a container that groups related content together with an optional heading.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "The accessibility label for screen readers.", "isOptional": true }, { @@ -23629,7 +24737,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -23656,7 +24764,7 @@ "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The heading text displayed at the top of the section. This heading provides a title for the section's content and automatically uses the appropriate semantic heading level (h2, h3, h4) based on nesting depth to maintain proper document structure.", + "description": "The heading text for the section.", "isOptional": true }, { @@ -23664,7 +24772,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "\"base\" | \"none\"", - "description": "The padding applied to all edges of the element.\n\n- `base`: applies padding that is appropriate for the element. Note that it might result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the section need to span to the edge of the section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "description": "Whether the section has padding.", "defaultValue": "'base'", "isOptional": true }, @@ -23673,7 +24781,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -23685,15 +24793,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Section extends PreactCustomElement implements SectionProps {\n constructor();\n /** @private */\n connectedCallback(): void;\n accessor accessibilityLabel: SectionProps['accessibilityLabel'];\n accessor heading: SectionProps['heading'];\n accessor padding: SectionProps['padding'];\n}" + "value": "declare class Section extends SectionBase implements SectionProps {\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -23716,7 +24831,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -23724,7 +24839,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -23732,7 +24847,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -23740,11 +24855,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -23756,19 +24871,18 @@ "SectionSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "SectionSlots", - "description": "The section component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The content displayed within the section component, which groups related elements together in a logical unit with an optional heading.", + "description": "The child elements to render inside the section.", "isOptional": true } ], - "value": "export interface SectionSlots {\n /**\n * The content displayed within the section component, which groups related elements together in a logical unit with an optional heading.\n */\n children?: HTMLElement;\n}" + "value": "export interface SectionSlots {\n /**\n * The child elements to render inside the section.\n */\n children?: HTMLElement;\n}" } } } @@ -23902,13 +25016,20 @@ "Select": { "filePath": "src/surfaces/admin/components.ts", "name": "Select", - "description": "Configure the following properties on the select component.", - "isPublicDocs": true, + "description": "A select dropdown that lets users choose one option from a list.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@hasInitialValueSymbol@16606", + "name": "__@hasInitialValueSymbol@17471", "value": "boolean", "description": "", "isPrivate": true, @@ -23917,7 +25038,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@15957", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, @@ -23926,9 +25047,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@usedFirstOptionSymbol@16605", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@usedFirstOptionSymbol@17470", "value": "boolean", - "description": "A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n\nThis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.", + "description": "used to determine if no value or defaultValue was set, in which case the first non-disabled option was used\n\nthis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form", "isPrivate": true, "isOptional": true }, @@ -23955,7 +25085,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -23972,8 +25102,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the select.", "isOptional": true }, { @@ -23981,7 +25111,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -23998,8 +25128,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "An error message that's displayed below the select when validation fails.", "isOptional": true }, { @@ -24015,8 +25145,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field.", "isOptional": true }, { @@ -24024,15 +25154,15 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "The text that describes what the select is for.", "isOptional": true }, { @@ -24040,7 +25170,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'", "isOptional": true }, @@ -24049,7 +25179,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -24057,7 +25187,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "Text that appears in the select when no option is selected to provide a hint about what to choose.", "isOptional": true }, { @@ -24065,7 +25195,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -24074,7 +25204,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether an option must be selected before the form can be submitted.", "defaultValue": "false", "isOptional": true }, @@ -24087,22 +25217,36 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component.", + "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected Option component.", "isOptional": true } ], - "value": "declare class Select extends PreactInputElement implements SelectProps {\n accessor icon: SelectProps['icon'];\n accessor details: SelectProps['details'];\n accessor error: SelectProps['error'];\n accessor label: SelectProps['label'];\n accessor placeholder: SelectProps['placeholder'];\n accessor required: SelectProps['required'];\n accessor labelAccessibilityVisibility: SelectProps['labelAccessibilityVisibility'];\n /** @private */\n connectedCallback(): void;\n /**\n * A lifecycle callback that fires when the component is removed from the DOM. Performs cleanup operations.\n * @private\n */\n disconnectedCallback(): void;\n constructor();\n /**\n * A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n *\n * This is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.\n * @private\n */\n [usedFirstOptionSymbol]: boolean;\n /**\n * @private\n */\n [hasInitialValueSymbol]: boolean;\n /**\n * The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component.\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n}" + "value": "declare class Select extends SelectBase implements SelectProps {\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -24125,7 +25269,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -24133,7 +25277,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -24141,7 +25285,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -24149,11 +25293,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -24165,15 +25309,14 @@ "SelectEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "SelectEvents", - "description": "The select component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the select value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -24181,27 +25324,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the select.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface SelectEvents {\n /**\n * A callback fired when the select value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the select.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n}" + "value": "export interface SelectEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -24213,19 +25354,18 @@ "SelectSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "SelectSlots", - "description": "The select component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The selectable options displayed in the dropdown list. Accepts option components for individual selectable items, and option group components to organize related options into logical groups with labels.", + "description": "The selectable options displayed in the dropdown list.\n\nAccepts option components for individual selectable items, and option group components to organize related options into logical groups with labels.", "isOptional": true } ], - "value": "export interface SelectSlots {\n /**\n * The selectable options displayed in the dropdown list. Accepts option components for individual selectable items, and option group components to organize related options into logical groups with labels.\n */\n children?: HTMLElement;\n}" + "value": "export interface SelectSlots {\n /**\n * The selectable options displayed in the dropdown list.\n *\n * Accepts option components for individual selectable items, and option group components to organize related options into logical groups with labels.\n */\n children?: HTMLElement;\n}" } } }, @@ -24237,9 +25377,25 @@ "Option": { "filePath": "src/surfaces/admin/components.ts", "name": "Option", - "description": "Represents a single option within a select component. Use only as a child of s-select components.", - "isPublicDocs": true, + "description": "A single option within a select dropdown that users can choose.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -24263,7 +25419,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -24281,7 +25437,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the option should be selected when it's first rendered.", "defaultValue": "false", "isOptional": true }, @@ -24290,7 +25446,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the option is disabled and can't be selected.", "defaultValue": "false", "isOptional": true }, @@ -24308,7 +25464,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -24317,7 +25473,7 @@ "syntaxKind": "PropertyDeclaration", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the option is currently selected.", "defaultValue": "false", "isOptional": true }, @@ -24330,22 +25486,29 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\".", + "description": "The value that's submitted with the form when this option is selected.", "isOptional": true } ], - "value": "declare class Option extends PreactCustomElement implements OptionProps {\n accessor selected: OptionProps['selected'];\n accessor defaultSelected: OptionProps['defaultSelected'];\n accessor value: OptionProps['value'];\n accessor disabled: OptionProps['disabled'];\n constructor();\n}" + "value": "declare class Option extends PolarisCustomElement implements OptionProps {\n /**\n * Whether the option is currently selected.\n */\n selected: OptionProps['selected'];\n /**\n * Whether the option should be selected when it's first rendered.\n */\n defaultSelected: OptionProps['defaultSelected'];\n /**\n * The value that's submitted with the form when this option is selected.\n */\n value: OptionProps['value'];\n /**\n * Whether the option is disabled and can't be selected.\n */\n disabled: OptionProps['disabled'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -24368,7 +25531,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -24376,7 +25539,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -24384,7 +25547,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -24392,11 +25555,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -24408,19 +25571,18 @@ "OptionSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionSlots", - "description": "The option component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The text or elements displayed as the option label, which identifies the selectable choice to users in a dropdown or selection list.", + "description": "The content that's used as the option label, displayed in the dropdown list.", "isOptional": true } ], - "value": "export interface OptionSlots {\n /**\n * The text or elements displayed as the option label, which identifies the selectable choice to users in a dropdown or selection list.\n */\n children?: HTMLElement;\n}" + "value": "export interface OptionSlots {\n /**\n * The content that's used as the option label, displayed in the dropdown list.\n */\n children?: HTMLElement;\n}" } } }, @@ -24432,9 +25594,25 @@ "OptionGroup": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionGroup", - "description": "Represents a group of options within a select component. Use only as a child of `s-select` components.", - "isPublicDocs": true, + "description": "A group of related options within a select dropdown, displayed with a label.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -24458,7 +25636,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -24476,7 +25654,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the options within this group can be selected or not.", + "description": "Whether all options in the group are disabled and can't be selected.", "defaultValue": "false", "isOptional": true }, @@ -24494,7 +25672,7 @@ "syntaxKind": "PropertyDeclaration", "name": "label", "value": "string", - "description": "The user-facing label for this group of options.", + "description": "The text that describes what this group of options represents.", "isOptional": true }, { @@ -24502,7 +25680,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -24514,15 +25692,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class OptionGroup\n extends PreactCustomElement\n implements OptionGroupProps\n{\n accessor disabled: OptionGroupProps['disabled'];\n accessor label: OptionGroupProps['label'];\n constructor();\n}" + "value": "declare class OptionGroup\n extends PolarisCustomElement\n implements OptionGroupProps\n{\n /**\n * Whether all options in the group are disabled and can't be selected.\n */\n disabled: OptionGroupProps['disabled'];\n /**\n * The text that describes what this group of options represents.\n */\n label: OptionGroupProps['label'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -24545,7 +25730,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -24553,7 +25738,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -24561,7 +25746,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -24569,11 +25754,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -24585,8 +25770,7 @@ "OptionGroupSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionGroupSlots", - "description": "The option group component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -24764,15 +25948,31 @@ "Spinner": { "filePath": "src/surfaces/admin/components.ts", "name": "Spinner", - "description": "Configure the following properties on the spinner component.", - "isPublicDocs": true, + "description": "A component that displays an animated loading indicator to show that content is currently being processed.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the spinner for assistive technologies.", "isOptional": true }, { @@ -24798,7 +25998,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -24825,7 +26025,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -24843,18 +26043,25 @@ "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the loading spinner.\n\n- `base`: Default size suitable for inline loading indicators or standard UI contexts.\n- `large`: Larger spinner for more prominent loading states.\n- `large-100`: Extra large spinner for full-page or emphasized loading states.", + "description": "The size of the spinner.", "defaultValue": "'base'", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Spinner extends PreactCustomElement implements SpinnerProps {\n accessor accessibilityLabel: string;\n accessor size: SpinnerProps['size'];\n constructor();\n}" + "value": "declare class Spinner extends PolarisCustomElement implements SpinnerProps {\n /**\n * A label that describes the spinner for assistive technologies.\n */\n accessibilityLabel: string;\n /**\n * The size of the spinner.\n */\n size: SpinnerProps['size'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -24877,7 +26084,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -24885,7 +26092,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -24893,7 +26100,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -24901,11 +26108,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } } @@ -25022,15 +26229,31 @@ "Stack": { "filePath": "src/surfaces/admin/components.ts", "name": "Stack", - "description": "Configure the following properties on the stack component.", - "isPublicDocs": true, + "description": "A stack is a layout component that arranges its children in a single direction with controlled spacing and alignment.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { @@ -25038,7 +26261,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'", "isOptional": true }, @@ -25047,7 +26270,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -25065,7 +26288,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "AlignContentKeyword", - "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.", "defaultValue": "'normal'", "isOptional": true }, @@ -25074,7 +26297,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "AlignItemsKeyword", - "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).", "defaultValue": "'normal'", "isOptional": true }, @@ -25092,7 +26315,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'", "isOptional": true }, @@ -25101,7 +26324,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'", "isOptional": true }, @@ -25110,7 +26333,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -25131,7 +26354,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -25140,7 +26363,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'", "isOptional": true }, @@ -25149,7 +26372,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -25158,7 +26381,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -25167,7 +26390,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -25176,7 +26399,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between columns in the stack.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -25194,7 +26417,7 @@ "syntaxKind": "PropertyDeclaration", "name": "direction", "value": "MaybeResponsive<\"inline\" | \"block\">", - "description": "The direction in which the stack's children are placed within the stack.\n\nAccepts:\n- A single value, either `inline` or `block`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported direction values as a query value", + "description": "The direction in which the stack's children are arranged.", "defaultValue": "'block'", "isOptional": true }, @@ -25212,7 +26435,7 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'", "isOptional": true }, @@ -25221,7 +26444,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between the stack's children.", "defaultValue": "'none'", "isOptional": true }, @@ -25230,7 +26453,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'", "isOptional": true }, @@ -25239,7 +26462,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "JustifyContentKeyword", - "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).", "defaultValue": "'normal'", "isOptional": true }, @@ -25248,7 +26471,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -25257,7 +26480,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'", "isOptional": true }, @@ -25266,7 +26489,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -25275,7 +26498,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'", "isOptional": true }, @@ -25284,7 +26507,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'", "isOptional": true }, @@ -25293,7 +26516,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'", "isOptional": true }, @@ -25302,7 +26525,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -25311,7 +26534,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -25320,7 +26543,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -25329,7 +26552,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -25338,7 +26561,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -25347,7 +26570,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -25356,7 +26579,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -25365,7 +26588,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between rows in the stack.", "defaultValue": "'' - meaning no override", "isOptional": true }, @@ -25377,192 +26600,178 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n accessor direction: StackProps['direction'];\n accessor justifyContent: StackProps['justifyContent'];\n accessor alignItems: StackProps['alignItems'];\n accessor alignContent: StackProps['alignContent'];\n accessor gap: StackProps['gap'];\n accessor rowGap: StackProps['rowGap'];\n accessor columnGap: StackProps['columnGap'];\n}" + "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n /**\n * The direction in which the stack's children are arranged.\n */\n direction: StackProps['direction'];\n /**\n * Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n */\n justifyContent: StackProps['justifyContent'];\n /**\n * Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n */\n alignItems: StackProps['alignItems'];\n /**\n * Controls the distribution of lines along the block axis when content wraps into multiple lines.\n */\n alignContent: StackProps['alignContent'];\n /**\n * The spacing between the stack's children.\n */\n gap: StackProps['gap'];\n /**\n * The spacing between rows in the stack.\n */\n rowGap: StackProps['rowGap'];\n /**\n * The spacing between columns in the stack.\n */\n columnGap: StackProps['columnGap'];\n}" }, "MaybeResponsive": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" }, "JustifyContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "JustifyContentKeyword", "value": "'normal' | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", - "isPublicDocs": true + "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container." }, "ContentDistribution": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentDistribution", "value": "'space-between' | 'space-around' | 'space-evenly' | 'stretch'", - "description": "Defines how space is distributed between and around content items in flex and grid layouts.\n- `space-between`: Distributes items evenly with the first item at the start and last at the end.\n- `space-around`: Distributes items evenly with equal space around each item.\n- `space-evenly`: Distributes items evenly with equal space between them.\n- `stretch`: Stretches items to fill the container.", - "isPublicDocs": true + "description": "" }, "OverflowPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "OverflowPosition", "value": "`unsafe ${ContentPosition}` | `safe ${ContentPosition}`", - "description": "Represents content positioning with overflow behavior control. Use `safe` to prevent content from becoming inaccessible when it overflows, or `unsafe` to allow overflow regardless of accessibility.", - "isPublicDocs": true + "description": "" }, "ContentPosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ContentPosition", "value": "'center' | 'start' | 'end'", - "description": "Defines the position of content along an axis.\n- `center`: Centers the content.\n- `start`: Aligns content to the start.\n- `end`: Aligns content to the end.", - "isPublicDocs": true + "description": "" }, "AlignItemsKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Align items sets the align-self value on all direct children as a group.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isPublicDocs": true + "description": "Align items sets the align-self value on all direct children as a group." }, "BaselinePosition": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BaselinePosition", "value": "'baseline' | 'first baseline' | 'last baseline'", - "description": "Represents baseline alignment positions used to align items relative to their baselines.\n- `baseline`: Aligns to the baseline of the parent.\n- `first baseline`: Aligns to the first baseline of the parent.\n- `last baseline`: Aligns to the last baseline of the parent.", - "isPublicDocs": true + "description": "" }, "AlignContentKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AlignContentKeyword", "value": "'normal' | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isPublicDocs": true + "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis." }, "MaybeTwoValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" }, "SpacingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SpacingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the spacing size between elements, using the standard size scale or `none` for no spacing.", - "isPublicDocs": true + "description": "" }, "SizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" }, "AccessibilityRole": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" }, "BackgroundColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" }, "ColorKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrAuto": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" }, "SizeUnits": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" }, "SizeUnitsOrNone": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" }, "MaybeAllValuesShorthandProperty": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" }, "PaddingKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" }, "BorderShorthand": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." }, "BorderSizeKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" }, "BorderStyleKeyword": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" }, "BoxBorderStyles": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true }, "BoxBorderRadii": { @@ -25570,14 +26779,13 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -25600,7 +26808,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -25608,7 +26816,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -25616,7 +26824,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -25624,11 +26832,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -25640,19 +26848,18 @@ "StackSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "StackSlots", - "description": "The stack component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The child elements displayed within the stack component, which are arranged vertically or horizontally with consistent spacing.", + "description": "The child elements to render inside the stack.", "isOptional": true } ], - "value": "export interface StackSlots {\n /**\n * The child elements displayed within the stack component, which are arranged vertically or horizontally with consistent spacing.\n */\n children?: HTMLElement;\n}" + "value": "export interface StackSlots {\n /**\n * The child elements to render inside the stack.\n */\n children?: HTMLElement;\n}" } } } @@ -25780,24 +26987,40 @@ "Switch": { "filePath": "src/surfaces/admin/components.ts", "name": "Switch", - "description": "Configure the following properties on the switch component.", - "isPublicDocs": true, + "description": "A switch that lets users toggle a setting on or off with a sliding control.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@15957", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers.", "isOptional": true }, { @@ -25823,7 +27046,7 @@ "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false", "isOptional": true }, @@ -25832,7 +27055,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -25850,7 +27073,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false", "isOptional": true }, @@ -25858,8 +27081,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -25867,7 +27090,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -25884,8 +27107,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -25902,15 +27125,15 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state.", + "value": "any", + "description": "Visual content to use as the control label.", "isOptional": true }, { @@ -25918,7 +27141,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'", "isOptional": true }, @@ -25927,7 +27150,15 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "", "isOptional": true }, { @@ -25935,7 +27166,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -25957,6 +27188,14 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -25966,13 +27205,19 @@ "isOptional": true } ], - "value": "declare class Switch extends PreactCheckboxElement implements SwitchProps {\n accessor labelAccessibilityVisibility: SwitchProps['labelAccessibilityVisibility'];\n constructor();\n}" + "value": "declare class Switch extends SwitchBase implements SwitchProps {\n constructor();\n}" + }, + "CallbackEvent": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CallbackEvent", + "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -25995,7 +27240,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -26003,7 +27248,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -26011,7 +27256,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -26019,11 +27264,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -26035,15 +27280,22 @@ "SwitchEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "SwitchEvents", - "description": "The switch component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "blur", + "value": "CallbackEventListener<'input'>", + "description": "", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the switch value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -26051,27 +27303,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the switch.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface SwitchEvents {\n /**\n * A callback fired when the switch value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the switch.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n}" + "value": "export interface SwitchEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -26238,14 +27488,13 @@ "Table": { "filePath": "src/surfaces/admin/components.ts", "name": "Table", - "description": "Configure the following properties on the table component.", - "isPublicDocs": true, + "description": "A component that displays data in a structured table format that automatically adapts to the available space.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@actualTableVariantSymbol@16681", - "value": "AddedContext", + "name": "__@actualTableVariantSymbol@17550", + "value": "_shopify_admin_web_component_foundations.AddedContext", "description": "", "isPrivate": true, "isOptional": true @@ -26253,8 +27502,34 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@tableHeadersSharedDataSymbol@16682", - "value": "AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@tableHeadersSharedDataSymbol@17551", + "value": "_shopify_admin_web_component_foundations.AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", "description": "", "isPrivate": true, "isOptional": true @@ -26282,7 +27557,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -26309,7 +27584,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hasNextPage", "value": "boolean", - "description": "Whether there's an additional page of data.", + "description": "Whether there's a next page of data that the user can navigate to.", "defaultValue": "false", "isOptional": true }, @@ -26318,7 +27593,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hasPreviousPage", "value": "boolean", - "description": "Whether there's a previous page of data.", + "description": "Whether there's a previous page of data that the user can navigate to.", "defaultValue": "false", "isOptional": true }, @@ -26327,7 +27602,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table. When `true`, the table might be in an inert state that prevents user interaction.", + "description": "Whether the table is currently in a loading state.", "defaultValue": "false", "isOptional": true }, @@ -26336,7 +27611,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paginate", "value": "boolean", - "description": "Whether to use pagination controls.", + "description": "Whether the pagination controls are displayed.", "defaultValue": "false", "isOptional": true }, @@ -26345,7 +27620,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -26360,85 +27635,50 @@ }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "variant", - "value": "\"auto\" | \"list\"", - "description": "The layout variant of the table component.\n\n- `list`: Always displays as a list layout.\n- `table`: Always displays as a traditional table layout.\n- `auto`: Automatically displays as a table on wide screens and as a list on narrow screens.", - "defaultValue": "'auto'", - "isOptional": true - } - ], - "value": "declare class Table extends PreactCustomElement implements TableProps {\n accessor variant: TableProps['variant'];\n accessor loading: TableProps['loading'];\n accessor paginate: TableProps['paginate'];\n accessor hasPreviousPage: TableProps['hasPreviousPage'];\n accessor hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" - }, - "AddedContext": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AddedContext", - "description": "", - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "addEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", - "description": "The **`addEventListener()`** method of the EventTarget interface sets up a function that will be called whenever the specified event is delivered to the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener)", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "dispatchEvent", - "value": "(event: Event) => boolean", - "description": "The **`dispatchEvent()`** method of the EventTarget sends an Event to the object, (synchronously) invoking the affected event listeners in the appropriate order.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/dispatchEvent)", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "removeEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", - "description": "The **`removeEventListener()`** method of the EventTarget interface removes an event listener previously registered with EventTarget.addEventListener() from the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/removeEventListener)", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "T", - "description": "The current context value.\n\nThe new context value to set, which will notify all consumers.", + "syntaxKind": "PropertyDeclaration", + "name": "variant", + "value": "\"auto\" | \"list\"", + "description": "The display variant of the table.", + "defaultValue": "'auto'", "isOptional": true } ], - "value": "declare class AddedContext extends EventTarget {\n constructor(defaultValue: T);\n /**\n * The current context value.\n */\n get value(): T;\n /**\n * The new context value to set, which will notify all consumers.\n */\n set value(value: T);\n}" + "value": "declare class Table extends PolarisCustomElement implements TableProps {\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The display variant of the table.\n */\n variant: TableProps['variant'];\n /**\n * Whether the table is currently in a loading state.\n */\n loading: TableProps['loading'];\n /**\n * Whether the pagination controls are displayed.\n */\n paginate: TableProps['paginate'];\n /**\n * Whether there's a previous page of data that the user can navigate to.\n */\n hasPreviousPage: TableProps['hasPreviousPage'];\n /**\n * Whether there's a next page of data that the user can navigate to.\n */\n hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: _shopify_admin_web_component_foundations.AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: _shopify_admin_web_component_foundations.AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" }, "ActualTableVariant": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ActualTableVariant", "value": "'table' | 'list'", - "description": "Represents the actual rendered variant of a table component.\n- `table`: Displays as a traditional table layout.\n- `list`: Displays as a list layout.", - "isPublicDocs": true + "description": "" }, "ListSlotType": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ListSlotType", "value": "'primary' | 'secondary' | 'kicker' | 'inline' | 'labeled'", - "description": "Represents the semantic type of content slots within list items.\n\n- `primary`: The main content or title of the list item.\n- `secondary`: Supporting or descriptive content below the primary content.\n- `kicker`: A small label or tag displayed above the primary content.\n- `inline`: Content displayed inline with the primary content.\n- `labeled`: Content with an associated label.", - "isPublicDocs": true + "description": "" }, "HeaderFormat": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -26461,7 +27701,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -26469,7 +27709,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -26477,7 +27717,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -26485,11 +27725,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -26501,15 +27741,14 @@ "TableSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TableSlots", - "description": "The table component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The table structure defining headers and data rows.\n\nAccepts table header row (for column headers) and table body (for data rows) components. Structure your table with a table header row first, followed by table body.", + "description": "The content to display inside the table, which should include table header row, table body, and table row components.", "isOptional": true }, { @@ -26517,11 +27756,11 @@ "syntaxKind": "PropertySignature", "name": "filters", "value": "HTMLElement", - "description": "Filter controls displayed above the table.\n\nAccepts input components like search field or select for filtering table data. These controls appear in a dedicated area above the table content.", + "description": "Additional filters to display in the table. For example, you can use the search field component to filter the table data.", "isOptional": true } ], - "value": "export interface TableSlots {\n /**\n * The table structure defining headers and data rows.\n *\n * Accepts table header row (for column headers) and table body (for data rows) components. Structure your table with a table header row first, followed by table body.\n */\n children?: HTMLElement;\n /**\n * Filter controls displayed above the table.\n *\n * Accepts input components like search field or select for filtering table data. These controls appear in a dedicated area above the table content.\n */\n filters?: HTMLElement;\n}" + "value": "export interface TableSlots {\n /**\n * The content to display inside the table, which should include table header row, table body, and table row components.\n */\n children?: HTMLElement;\n /**\n * Additional filters to display in the table. For example, you can use the search field component to filter the table data.\n */\n filters?: HTMLElement;\n}" } } }, @@ -26533,15 +27772,14 @@ "TableEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "TableEvents", - "description": "The table component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "nextpage", "value": "CallbackEventListener | null", - "description": "A callback fired when the user navigates to the next page.", + "description": "The event listener that's called when the user navigates to the next page.", "isOptional": true }, { @@ -26549,27 +27787,25 @@ "syntaxKind": "PropertySignature", "name": "previouspage", "value": "CallbackEventListener | null", - "description": "A callback fired when the user navigates to the previous page.", + "description": "The event listener that's called when the user navigates to the previous page.", "isOptional": true } ], - "value": "export interface TableEvents {\n /**\n * A callback fired when the user navigates to the previous page.\n */\n previouspage: CallbackEventListener | null = null;\n /**\n * A callback fired when the user navigates to the next page.\n */\n nextpage: CallbackEventListener | null = null;\n}" + "value": "export interface TableEvents {\n /**\n * The event listener that's called when the user navigates to the previous page.\n */\n previouspage: CallbackEventListener | null = null;\n /**\n * The event listener that's called when the user navigates to the next page.\n */\n nextpage: CallbackEventListener | null = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } }, @@ -26581,9 +27817,34 @@ "TableBody": { "filePath": "src/surfaces/admin/components.ts", "name": "TableBody", - "description": "The table body component represents the main content area of a table, containing the data rows. Use table body as a child of table to structure your table data, with each table row within the body representing a single record or entry.\n\nTable body must contain table row components, which in turn contain table cell components for the actual data values.", - "isPublicDocs": true, + "description": "A component that wraps the body content of a table, which contains the data rows.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -26607,7 +27868,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -26634,7 +27895,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -26646,15 +27907,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class TableBody extends PreactCustomElement implements TableBodyProps {\n constructor();\n}" + "value": "declare class TableBody extends PolarisCustomElement implements TableBodyProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -26677,7 +27945,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -26685,7 +27953,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -26693,7 +27961,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -26701,11 +27969,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -26717,19 +27985,18 @@ "TableBodySlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TableBodySlots", - "description": "The table body component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The data rows displayed in the table body.\n\nAccepts table row components, with each row representing a single record or entry in the table.", + "description": "The body content of the table, which should include table row components. This content might not have any semantic meaning when the table uses the `list` variant.", "isOptional": true } ], - "value": "export interface TableBodySlots {\n /**\n * The data rows displayed in the table body.\n *\n * Accepts table row components, with each row representing a single record or entry in the table.\n */\n children?: HTMLElement;\n}" + "value": "export interface TableBodySlots {\n /**\n * The body content of the table, which should include table row components. This content might not have any semantic meaning when the table uses the `list` variant.\n */\n children?: HTMLElement;\n}" } } }, @@ -26741,18 +28008,43 @@ "TableCell": { "filePath": "src/surfaces/admin/components.ts", "name": "TableCell", - "description": "The table cell component represents a single data cell within a table row. Use table cell as a child of table row to display individual data values, with each cell corresponding to a column in the table.\n\nTable cell automatically inherits styling and alignment from its parent table structure and supports text content or other inline components.", - "isPublicDocs": true, + "description": "A component that represents a single cell in a table row, which displays data in a format that's determined by its column header.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", - "name": "__@headerFormatSymbol@16704", + "name": "__@headerFormatSymbol@17578", "value": "HeaderFormat", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -26776,7 +28068,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -26803,7 +28095,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -26815,23 +28107,30 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class TableCell extends PreactCustomElement implements TableCellProps {\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" + "value": "declare class TableCell extends PolarisCustomElement implements TableCellProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" }, "HeaderFormat": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -26854,7 +28153,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -26862,7 +28161,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -26870,7 +28169,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -26878,11 +28177,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -26894,19 +28193,18 @@ "TableCellSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TableCellSlots", - "description": "The table cell component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The data value displayed in this cell.\n\nAccepts text content or inline components representing the cell's data value.", + "description": "The content to display inside the table cell.", "isOptional": true } ], - "value": "export interface TableCellSlots {\n /**\n * The data value displayed in this cell.\n *\n * Accepts text content or inline components representing the cell's data value.\n */\n children?: HTMLElement;\n}" + "value": "export interface TableCellSlots {\n /**\n * The content to display inside the table cell.\n */\n children?: HTMLElement;\n}" } } }, @@ -26918,9 +28216,34 @@ "TableHeader": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeader", - "description": "The table header component represents a single column header within a table header row. Use table header as a child of table header row to define column headings and optionally enable column sorting.\n\nTable header provides semantic meaning for screen readers and can include sorting controls when configured. Each header corresponds to a column in the table body.", - "isPublicDocs": true, + "description": "A component that defines a column header in a table, which specifies both the header label and how the column's data should be formatted.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -26944,7 +28267,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -26971,7 +28294,7 @@ "syntaxKind": "PropertyDeclaration", "name": "format", "value": "HeaderFormat", - "description": "The format of the column that controls styling and alignment of cell content.", + "description": "The format of the header and its corresponding cells.", "isOptional": true }, { @@ -26979,7 +28302,7 @@ "syntaxKind": "PropertyDeclaration", "name": "listSlot", "value": "ListSlotType", - "description": "The content designation for this column when the table displays in list variant on mobile devices.", + "description": "The slot where this header's data appears when the table is shown in list view.", "defaultValue": "'labeled'", "isOptional": true }, @@ -26988,7 +28311,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -27000,31 +28323,37 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class TableHeader\n extends PreactCustomElement\n implements TableHeaderProps\n{\n accessor listSlot: TableHeaderProps['listSlot'];\n accessor format: TableHeaderProps['format'];\n constructor();\n}" + "value": "declare class TableHeader\n extends PolarisCustomElement\n implements TableHeaderProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The slot where this header's data appears when the table is shown in list view.\n */\n listSlot: TableHeaderProps['listSlot'];\n /**\n * The format of the header and its corresponding cells.\n */\n format: TableHeaderProps['format'];\n constructor();\n}" }, "ListSlotType": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ListSlotType", "value": "'primary' | 'secondary' | 'kicker' | 'inline' | 'labeled'", - "description": "Represents the semantic type of content slots within list items.\n\n- `primary`: The main content or title of the list item.\n- `secondary`: Supporting or descriptive content below the primary content.\n- `kicker`: A small label or tag displayed above the primary content.\n- `inline`: Content displayed inline with the primary content.\n- `labeled`: Content with an associated label.", - "isPublicDocs": true + "description": "" }, "HeaderFormat": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -27047,7 +28376,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -27055,7 +28384,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -27063,7 +28392,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -27071,11 +28400,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -27087,33 +28416,57 @@ "TableHeaderSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeaderSlots", - "description": "The table header component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The column heading text.\n\nThis text labels the column in table variant and appears as a label for data in list variant.", + "description": "The heading of the column when the table uses the `table` variant, and the label of its data when the table uses the `list` variant.", + "isOptional": true + } + ], + "value": "export interface TableHeaderSlots {\n /**\n * The heading of the column when the table uses the `table` variant, and the label of its data when the table uses the `list` variant.\n */\n children?: HTMLElement;\n}" + } + } + }, + { + "title": "Table header row", + "description": "The table header row component represents the header row of a table, containing column headings. Use table header row as the first child of table (before table body) to define the table structure and provide column labels.\n\nTable header row must contain table header components for each column. These headers provide context for the data columns and can support sorting functionality.", + "type": "TableHeaderRow", + "typeDefinitions": { + "TableHeaderRow": { + "filePath": "src/surfaces/admin/components.ts", + "name": "TableHeaderRow", + "description": "A component that wraps the header row of a table, which contains the table header components that define the column structure.", + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, "isOptional": true - } - ], - "value": "export interface TableHeaderSlots {\n /**\n * The column heading text.\n *\n * This text labels the column in table variant and appears as a label for data in list variant.\n */\n children?: HTMLElement;\n}" - } - } - }, - { - "title": "Table header row", - "description": "The table header row component represents the header row of a table, containing column headings. Use table header row as the first child of table (before table body) to define the table structure and provide column labels.\n\nTable header row must contain table header components for each column. These headers provide context for the data columns and can support sorting functionality.", - "type": "TableHeaderRow", - "typeDefinitions": { - "TableHeaderRow": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TableHeaderRow", - "description": "The table header row component represents the header row of a table, containing column headings. Use table header row as the first child of table (before table body) to define the table structure and provide column labels.\n\nTable header row must contain table header components for each column. These headers provide context for the data columns and can support sorting functionality.", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -27137,7 +28490,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -27164,7 +28517,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -27176,15 +28529,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class TableHeaderRow\n extends PreactCustomElement\n implements TableHeaderRowProps\n{\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class TableHeaderRow\n extends PolarisCustomElement\n implements TableHeaderRowProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -27207,7 +28567,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -27215,7 +28575,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -27223,7 +28583,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -27231,11 +28591,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -27247,19 +28607,18 @@ "TableHeaderRowSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeaderRowSlots", - "description": "The table header row component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The column headers displayed in the table header row.\n\nAccepts table header components, with each header defining a column and providing its label.", + "description": "The content to display inside the table header row, which should include table header components.", "isOptional": true } ], - "value": "export interface TableHeaderRowSlots {\n /**\n * The column headers displayed in the table header row.\n *\n * Accepts table header components, with each header defining a column and providing its label.\n */\n children?: HTMLElement;\n}" + "value": "export interface TableHeaderRowSlots {\n /**\n * The content to display inside the table header row, which should include table header components.\n */\n children?: HTMLElement;\n}" } } }, @@ -27271,9 +28630,34 @@ "TableRow": { "filePath": "src/surfaces/admin/components.ts", "name": "TableRow", - "description": "The table row component represents a single row of data within a table body. Use table row as a child of table body to structure individual records or entries in the table.\n\nTable row must contain table cell components, with each cell representing a data value for the corresponding column. The number of cells should match the number of headers in the table.", - "isPublicDocs": true, + "description": "A component that represents a single row in a table, which contains the data cells.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@17552", + "value": "ElementInternals", + "description": "", + "isPrivate": true, + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -27297,7 +28681,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -27306,7 +28690,7 @@ "syntaxKind": "PropertyDeclaration", "name": "clickDelegate", "value": "string", - "description": "The ID of an interactive element, such as `s-link`, in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally.", + "description": "A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector.", "isOptional": true }, { @@ -27332,7 +28716,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -27344,15 +28728,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class TableRow extends PreactCustomElement implements TableRowProps {\n constructor();\n accessor clickDelegate: string;\n}" + "value": "declare class TableRow extends PolarisCustomElement implements TableRowProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /**\n * A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector.\n */\n clickDelegate: string;\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -27375,7 +28766,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -27383,7 +28774,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -27391,7 +28782,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -27399,11 +28790,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -27415,19 +28806,18 @@ "TableRowSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TableRowSlots", - "description": "The table row component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The data cells displayed in this table row.\n\nAccepts table cell components, with each cell containing a data value for the corresponding column.", + "description": "The content to display inside the row, which should include table cell components.", "isOptional": true } ], - "value": "export interface TableRowSlots {\n /**\n * The data cells displayed in this table row.\n *\n * Accepts table cell components, with each cell containing a data value for the corresponding column.\n */\n children?: HTMLElement;\n}" + "value": "export interface TableRowSlots {\n /**\n * The content to display inside the row, which should include table cell components.\n */\n children?: HTMLElement;\n}" } } } @@ -27578,15 +28968,31 @@ "Text": { "filePath": "src/surfaces/admin/components.ts", "name": "Text", - "description": "Configure the following properties on the text component.", - "isPublicDocs": true, + "description": "A custom element for displaying inline or small blocks of text with various visual styles and semantic meanings. Use Text to render short pieces of content with appropriate styling, emphasis, and color treatment.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'", "isOptional": true }, @@ -27613,7 +29019,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -27622,7 +29028,7 @@ "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color of the text.", "defaultValue": "'base'", "isOptional": true }, @@ -27640,7 +29046,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''", "isOptional": true }, @@ -27658,8 +29064,8 @@ "syntaxKind": "PropertyDeclaration", "name": "fontVariantNumeric", "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", - "defaultValue": "'auto'", + "description": "The numeric font variant for the text.", + "defaultValue": "'auto' - inherit from the parent element", "isOptional": true }, { @@ -27667,7 +29073,7 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "The ID of an element this text provides contextual information for.", "isOptional": true }, { @@ -27675,7 +29081,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -27705,15 +29111,22 @@ "description": "The semantic type and styling treatment for the text content.\n\n- `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n- `generic`: Standard text with no special semantic meaning or styling.\n- `address`: Marks the text as contact information, such as a physical or email address.\n- `redundant`: Indicates the text is redundant or duplicated information for screen reader context.", "defaultValue": "'generic'", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class Text extends PreactCustomElement implements TextProps {\n accessor fontVariantNumeric: TextProps['fontVariantNumeric'];\n accessor color: TextProps['color'];\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: TextProps['tone'];\n /**\n * The semantic type and styling treatment for the text content.\n *\n * - `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n * - `generic`: Standard text with no special semantic meaning or styling.\n * - `address`: Marks the text as contact information, such as a physical or email address.\n * - `redundant`: Indicates the text is redundant or duplicated information for screen reader context.\n */\n accessor type: TextProps['type'];\n accessor dir: TextProps['dir'];\n accessor accessibilityVisibility: TextProps['accessibilityVisibility'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Text extends TextBase implements TextProps {\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: TextProps['tone'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -27736,7 +29149,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -27744,7 +29157,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -27752,7 +29165,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -27760,11 +29173,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -27776,19 +29189,18 @@ "TextSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TextSlots", - "description": "The text component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The text content displayed within the text component, which applies semantic meaning and styling appropriate to the specified text type.", + "description": "The content of the text.", "isOptional": true } ], - "value": "export interface TextSlots {\n /**\n * The text content displayed within the text component, which applies semantic meaning and styling appropriate to the specified text type.\n */\n children?: HTMLElement;\n}" + "value": "export interface TextSlots {\n /**\n * The content of the text.\n */\n children?: HTMLElement;\n}" } } } @@ -27973,18 +29385,34 @@ "TextArea": { "filePath": "src/surfaces/admin/components.ts", "name": "TextArea", - "description": "Configure the following properties on the text area component.", - "isPublicDocs": true, + "description": "The text area custom element class that renders a multi-line text input field in the Shopify admin interface. This component allows merchants to enter and edit longer text content with support for labels, validation, and length constraints.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@15957", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -28007,8 +29435,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else", "isOptional": true }, @@ -28017,7 +29445,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -28035,15 +29463,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -28051,7 +29479,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -28068,8 +29496,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -28104,7 +29532,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -28112,7 +29540,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -28120,8 +29548,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -28129,7 +29557,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -28138,7 +29566,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity", "isOptional": true }, @@ -28147,7 +29575,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0", "isOptional": true }, @@ -28156,7 +29584,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -28164,7 +29592,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -28172,7 +29600,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -28181,7 +29609,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -28190,7 +29618,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -28199,7 +29627,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rows", "value": "number", - "description": "A number of visible text lines.", + "description": "The number of visible text lines for the field, controlling its initial height.", "defaultValue": "2", "isOptional": true }, @@ -28212,30 +29640,36 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true } ], - "value": "declare class TextArea\n extends PreactFieldElement\n implements TextAreaProps\n{\n accessor maxLength: TextAreaProps['maxLength'];\n accessor minLength: TextAreaProps['minLength'];\n accessor rows: TextAreaProps['rows'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextArea extends TextAreaBase implements TextAreaProps {\n constructor();\n}" }, "TextAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -28258,7 +29692,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -28266,7 +29700,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -28274,7 +29708,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -28282,11 +29716,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -28298,15 +29732,14 @@ "TextAreaEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "TextAreaEvents", - "description": "The text area component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text area loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -28314,7 +29747,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text area value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -28322,7 +29755,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text area receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -28330,27 +29763,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the text area.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface TextAreaEvents {\n /**\n * A callback fired when the text area value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the text area.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the text area loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the text area receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface TextAreaEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -28484,18 +29915,34 @@ "TextField": { "filePath": "src/surfaces/admin/components.ts", "name": "TextField", - "description": "Configure the following properties on the text field component.", - "isPublicDocs": true, + "description": "The text field custom element class that renders a single-line text input field in the Shopify admin interface. This component allows merchants to enter and edit text with support for labels, validation, icons, and prefix/suffix content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@15957", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -28518,8 +29965,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else", "isOptional": true }, @@ -28528,7 +29975,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -28546,15 +29993,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -28562,7 +30009,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -28579,8 +30026,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -28614,8 +30061,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\" | AnyString", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "value": "IconType | AnyString", + "description": "An icon to display at the start of the text field, providing visual context for the input. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", "defaultValue": "''", "isOptional": true }, @@ -28624,7 +30071,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -28632,7 +30079,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -28640,8 +30087,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -28649,7 +30096,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -28658,7 +30105,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the merchant can enter in the field. When this limit is reached, the field prevents further input.", "defaultValue": "Infinity", "isOptional": true }, @@ -28667,7 +30114,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation. The field will be considered invalid if the merchant enters fewer characters than this value.", "defaultValue": "0", "isOptional": true }, @@ -28676,7 +30123,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -28684,7 +30131,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -28692,7 +30139,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the merchant's input, such as a currency symbol (`$`) or protocol (`https://`).", "defaultValue": "''", "isOptional": true }, @@ -28701,7 +30148,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -28710,7 +30157,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -28719,7 +30166,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -28737,42 +30184,54 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the merchant's input, such as a unit of measurement (`kg`, `%`) or domain (`.myshopify.com`).", "defaultValue": "''", "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true } ], - "value": "declare class TextField\n extends PreactFieldElement\n implements TextFieldProps\n{\n accessor icon: TextFieldProps['icon'];\n accessor maxLength: TextFieldProps['maxLength'];\n accessor minLength: TextFieldProps['minLength'];\n accessor prefix: TextFieldProps['prefix'];\n accessor suffix: TextFieldProps['suffix'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextField extends TextFieldBase implements TextFieldProps {\n constructor();\n}" + }, + "IconType": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" }, "AnyString": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AnyString", "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true + "description": "Prevents widening string literal types in a union to `string`." }, "TextAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -28795,7 +30254,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -28803,7 +30262,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -28811,7 +30270,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -28819,11 +30278,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -28835,19 +30294,18 @@ "TextFieldSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TextFieldSlots", - "description": "The text field component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "accessory", "value": "HTMLElement", - "description": "Additional interactive content displayed within the text field.\n\nAccepts button and clickable components with text content only. Other component types or complex layouts are not supported.", + "description": "An accessory element to display at the end of the text field, such as a button, icon, or other interactive component. This appears inside the field's visual boundary, typically for actions like clearing the field or showing additional options.", "isOptional": true } ], - "value": "export interface TextFieldSlots {\n /**\n * Additional interactive content displayed within the text field.\n *\n * Accepts button and clickable components with text content only. Other component types or complex layouts are not supported.\n */\n accessory?: HTMLElement;\n}" + "value": "export interface TextFieldSlots {\n /**\n * An accessory element to display at the end of the text field, such as a button, icon, or other interactive component. This appears inside the field's visual boundary, typically for actions like clearing the field or showing additional options.\n */\n accessory?: HTMLElement;\n}" } } }, @@ -28859,15 +30317,14 @@ "TextFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "TextFieldEvents", - "description": "The text field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -28875,7 +30332,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -28883,7 +30340,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -28891,27 +30348,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the text field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface TextFieldEvents {\n /**\n * A callback fired when the text field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the text field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the text field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the text field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface TextFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -29062,9 +30517,25 @@ "Thumbnail": { "filePath": "src/surfaces/admin/components.ts", "name": "Thumbnail", - "description": "Configure the following properties on the thumbnail component.", - "isPublicDocs": true, + "description": "A thumbnail displays a small preview image with configurable sizing.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -29079,8 +30550,8 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``", + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`", "isOptional": true }, { @@ -29097,7 +30568,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -29124,7 +30595,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -29142,7 +30613,7 @@ "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the product thumbnail image.\n\n- `small-200`: Smallest thumbnail size, ideal for compact product lists or tables.\n- `small-100`: Very small thumbnail, suitable for dense layouts.\n- `small`: Small thumbnail for space-constrained contexts.\n- `base`: Default size that balances visibility and space efficiency.\n- `large`: Larger thumbnail for featured products or detailed views.\n- `large-100`: Extra large thumbnail for prominent product display.", + "description": "The size of the thumbnail.", "defaultValue": "'base'", "isOptional": true }, @@ -29151,17 +30622,24 @@ "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered.", + "description": "The URL of the image to display in the thumbnail.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", "isOptional": true } ], - "value": "declare class Thumbnail extends PreactCustomElement implements ThumbnailProps {\n accessor src: ThumbnailProps['src'];\n accessor alt: ThumbnailProps['alt'];\n accessor size: ThumbnailProps['size'];\n constructor();\n}" + "value": "declare class Thumbnail extends PolarisCustomElement implements ThumbnailProps {\n /**\n * The URL of the image to display in the thumbnail.\n */\n src: ThumbnailProps['src'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ThumbnailProps['alt'];\n /**\n * The size of the thumbnail.\n */\n size: ThumbnailProps['size'];\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -29184,7 +30662,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -29192,7 +30670,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -29200,7 +30678,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -29208,11 +30686,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -29224,15 +30702,14 @@ "ThumbnailEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "ThumbnailEvents", - "description": "The thumbnail component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "error", "value": "OnErrorEventHandler", - "description": "A callback fired when the thumbnail image fails to load.\n\nLearn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).", + "description": "A callback that's fired when the image fails to load.", "isOptional": true }, { @@ -29240,27 +30717,25 @@ "syntaxKind": "PropertySignature", "name": "load", "value": "CallbackEventListener | null", - "description": "A callback fired when the thumbnail image successfully loads.\n\nLearn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).", + "description": "A callback that's fired when the image has loaded successfully.", "isOptional": true } ], - "value": "export interface ThumbnailEvents {\n /**\n * A callback fired when the thumbnail image successfully loads.\n *\n * Learn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback fired when the thumbnail image fails to load.\n *\n * Learn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).\n */\n error: OnErrorEventHandler = null;\n}" + "value": "export interface ThumbnailEvents {\n /**\n * A callback that's fired when the image has loaded successfully.\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback that's fired when the image fails to load.\n */\n error: OnErrorEventHandler = null;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -29377,19 +30852,18 @@ "TooltipSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "TooltipSlots", - "description": "The tooltip component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The informational text or elements displayed within the tooltip overlay, providing helpful context or explanations when users interact with the associated element.\n\nOnly accepts text, paragraph components, and raw `textContent`.", + "description": "The content to display inside the tooltip, which should include text or paragraph components, or raw text content.", "isOptional": true } ], - "value": "export interface TooltipSlots {\n /**\n * The informational text or elements displayed within the tooltip overlay, providing helpful context or explanations when users interact with the associated element.\n *\n * Only accepts text, paragraph components, and raw `textContent`.\n */\n children?: HTMLElement;\n}" + "value": "export interface TooltipSlots {\n /**\n * The content to display inside the tooltip, which should include text or paragraph components, or raw text content.\n */\n children?: HTMLElement;\n}" } } } @@ -29505,18 +30979,34 @@ "URLField": { "filePath": "src/surfaces/admin/components.ts", "name": "URLField", - "description": "Configure the following properties on the URL field component.", - "isPublicDocs": true, + "description": "The URL field custom element class that renders a URL input field in the Shopify admin interface. This component allows merchants to enter web addresses with automatic URL validation and appropriate mobile keyboard layouts.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@15957", + "name": "__@internals$4@16693", "value": "ElementInternals", "description": "", "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -29540,8 +31030,8 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | `section-${string} url` | `section-${string} photo` | `section-${string} impp` | `section-${string} home impp` | `section-${string} mobile impp` | `section-${string} fax impp` | `section-${string} pager impp` | \"shipping url\" | \"shipping photo\" | \"shipping impp\" | \"shipping home impp\" | \"shipping mobile impp\" | \"shipping fax impp\" | \"shipping pager impp\" | \"billing url\" | \"billing photo\" | \"billing impp\" | \"billing home impp\" | \"billing mobile impp\" | \"billing fax impp\" | \"billing pager impp\" | `section-${string} shipping url` | `section-${string} shipping photo` | `section-${string} shipping impp` | `section-${string} shipping home impp` | `section-${string} shipping mobile impp` | `section-${string} shipping fax impp` | `section-${string} shipping pager impp` | `section-${string} billing url` | `section-${string} billing photo` | `section-${string} billing impp` | `section-${string} billing home impp` | `section-${string} billing mobile impp` | `section-${string} billing fax impp` | `section-${string} billing pager impp` | URLAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else", + "description": "A hint about the intended content of the field for browser autofill.", + "defaultValue": "'url'", "isOptional": true }, { @@ -29549,7 +31039,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -29567,15 +31057,15 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -29583,7 +31073,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false", "isOptional": true }, @@ -29600,8 +31090,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { @@ -29636,7 +31126,7 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -29644,7 +31134,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true, "isOptional": true }, @@ -29652,8 +31142,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "value": "any", + "description": "Content to use as the field label.", "isOptional": true }, { @@ -29661,7 +31151,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'", "isOptional": true }, @@ -29670,7 +31160,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the URL.", "defaultValue": "Infinity", "isOptional": true }, @@ -29679,7 +31169,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the URL.", "defaultValue": "0", "isOptional": true }, @@ -29688,7 +31178,7 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { @@ -29696,7 +31186,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { @@ -29704,7 +31194,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -29713,7 +31203,7 @@ "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false", "isOptional": true }, @@ -29722,7 +31212,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false", "isOptional": true }, @@ -29735,30 +31225,36 @@ "isPrivate": true, "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing.", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true } ], - "value": "declare class URLField\n extends PreactFieldElement\n implements URLFieldProps\n{\n accessor autocomplete: URLFieldProps['autocomplete'];\n accessor maxLength: URLFieldProps['maxLength'];\n accessor minLength: URLFieldProps['minLength'];\n /**\n * The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class URLField extends URLFieldBase implements URLFieldProps {\n constructor();\n}" }, "URLAutocompleteField": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "URLAutocompleteField", "value": "'url' | 'photo' | 'impp' | 'home impp' | 'mobile impp' | 'fax impp' | 'pager impp'", - "description": "Represents autocomplete values that are valid for URL input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for URL inputs.\n\nAvailable values:\n- `url` - General URL or web address\n- `photo` - URL to a photo or image\n- `impp` - Instant messaging protocol URL\n- `home impp` - Home instant messaging protocol URL\n- `mobile impp` - Mobile instant messaging protocol URL\n- `fax impp` - Fax instant messaging protocol URL\n- `pager impp` - Pager instant messaging protocol URL", - "isPublicDocs": true + "description": "" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -29781,7 +31277,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -29789,7 +31285,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -29797,7 +31293,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -29805,11 +31301,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -29821,15 +31317,14 @@ "URLFieldEvents": { "filePath": "src/surfaces/admin/components.ts", "name": "URLFieldEvents", - "description": "The URL field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blur", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the URL field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "", "isOptional": true }, { @@ -29837,7 +31332,7 @@ "syntaxKind": "PropertySignature", "name": "change", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the URL field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "", "isOptional": true }, { @@ -29845,7 +31340,7 @@ "syntaxKind": "PropertySignature", "name": "focus", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the URL field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "", "isOptional": true }, { @@ -29853,27 +31348,25 @@ "syntaxKind": "PropertySignature", "name": "input", "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the URL field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).", + "description": "", "isOptional": true } ], - "value": "export interface URLFieldEvents {\n /**\n * A callback fired when the URL field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the URL field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the URL field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the URL field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface URLFieldEvents {\n change: CallbackEventListener<'input'>;\n input: CallbackEventListener<'input'>;\n blur: CallbackEventListener<'input'>;\n focus: CallbackEventListener<'input'>;\n}" }, "CallbackEventListener": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEventListener", "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true + "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events." }, "CallbackEvent": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "CallbackEvent", "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } } } @@ -29989,19 +31482,18 @@ "UnorderedListSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "UnorderedListSlots", - "description": "The unordered list component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The list entries displayed within the unordered list, where each item is marked with a bullet point. Only accepts list item components as children. Each list item represents a single bulleted entry in the list.", + "description": "The items in the unordered list. Only list item components are accepted.", "isOptional": true } ], - "value": "export interface UnorderedListSlots {\n /**\n * The list entries displayed within the unordered list, where each item is marked with a bullet point. Only accepts list item components as children. Each list item represents a single bulleted entry in the list.\n */\n children?: HTMLElement;\n}" + "value": "export interface UnorderedListSlots {\n /**\n * The items in the unordered list. Only list item components are accepted.\n */\n children?: HTMLElement;\n}" } } }, @@ -30013,9 +31505,25 @@ "ListItem": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItem", - "description": "The list item component represents a single entry within an ordered list or unordered list. Use list item to structure individual points, steps, or items within a list, with each item automatically receiving appropriate list markers (bullets or numbers) from its parent list.\n\nList item must be used as a direct child of ordered list or unordered list components. Each list item can contain text, inline formatting, or other components to create rich list content.", - "isPublicDocs": true, + "description": "A component that represents a single item within an ordered list or unordered list.\n\nUse list item as a child of ordered list or unordered list to create properly structured and accessible list content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@16092", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@16091", + "value": "ShadowRoot", + "description": "", + "isPrivate": true, + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -30039,7 +31547,7 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true, "isOptional": true }, @@ -30066,7 +31574,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true, "isOptional": true }, @@ -30078,15 +31586,22 @@ "description": "", "isPrivate": true, "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties.", + "isOptional": true } ], - "value": "declare class ListItem extends PreactCustomElement implements ListItemProps {\n constructor();\n}" + "value": "declare class ListItem extends PolarisCustomElement implements ListItemProps {\n constructor();\n}" }, "ClickOptions": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -30109,7 +31624,7 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.", + "description": "", "isOptional": true }, { @@ -30117,7 +31632,7 @@ "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -30125,7 +31640,7 @@ "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.", + "description": "", "isOptional": true }, { @@ -30133,11 +31648,11 @@ "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred.", + "description": "", "isOptional": true } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } } }, @@ -30149,19 +31664,18 @@ "ListItemSlots": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItemSlots", - "description": "The list item component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "HTMLElement", - "description": "The content displayed within the list item, which represents a single entry in an ordered or unordered list.", + "description": "The content to display inside the list item.", "isOptional": true } ], - "value": "export interface ListItemSlots {\n /**\n * The content displayed within the list item, which represents a single entry in an ordered or unordered list.\n */\n children?: HTMLElement;\n}" + "value": "export interface ListItemSlots {\n /**\n * The content to display inside the list item.\n */\n children?: HTMLElement;\n}" } } } diff --git a/packages/ui-extensions/docs/surfaces/admin/generated/app_home/generated_docs_data_v2.json b/packages/ui-extensions/docs/surfaces/admin/generated/app_home/generated_docs_data_v2.json index 71174d4454..1b030db53a 100644 --- a/packages/ui-extensions/docs/surfaces/admin/generated/app_home/generated_docs_data_v2.json +++ b/packages/ui-extensions/docs/surfaces/admin/generated/app_home/generated_docs_data_v2.json @@ -179,6 +179,13 @@ "value": "RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >", "description": "A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options." }, + { + "filePath": "src/surfaces/admin/extension-targets.ts", + "syntaxKind": "PropertySignature", + "name": "admin.app.intent.render", + "value": "RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >", + "description": "Renders an admin extension for handling app intents." + }, { "filePath": "src/surfaces/admin/extension-targets.ts", "syntaxKind": "PropertySignature", @@ -706,7 +713,7 @@ "description": "A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules." } ], - "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n}" + "value": "export interface ExtensionTargets {\n /**\n * A runnable target that provides [customer segment templates](/docs/apps/build/marketing-analytics/customer-segments/build-a-template-extension) in the [customer segment editor](https://help.shopify.com/manual/customers/customer-segmentation/create-customer-segments). Use this target to provide pre-built segment templates that merchants can use as starting points for creating targeted customer groups based on custom criteria.\n */\n 'admin.customers.segmentation-templates.data': RunnableExtension<\n CustomerSegmentTemplateApi<'admin.customers.segmentation-templates.data'>,\n {templates: CustomerSegmentTemplate[]}\n >;\n\n // Blocks\n /**\n * A block target that displays inline content within the product details page. Use this to show product-specific information, tools, or actions directly on the product page.\n */\n 'admin.product-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the order details page. Use this to show order-specific information, fulfillment tools, or custom order actions.\n */\n 'admin.order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that appears when merchants create or edit a discount powered by your discount function, allowing them to configure function-specific settings. Use this to build custom configuration interfaces for discount function parameters.\n */\n 'admin.discount-details.function-settings.render': RenderExtension<\n DiscountFunctionSettingsApi<'admin.discount-details.function-settings.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A block target that displays inline content within the customer details page. Use this to show customer-specific information, loyalty data, or custom customer actions.\n */\n 'admin.customer-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.customer-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the collection details page. Use this to show collection analytics, bulk product operations, or collection-specific tools.\n */\n 'admin.collection-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.collection-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the draft order details page. Use this to show custom pricing calculations, special order handling tools, or order-specific information.\n */\n 'admin.draft-order-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.draft-order-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the abandoned checkout details page. Use this to show cart recovery tools, abandonment analysis, or customer re-engagement options.\n */\n 'admin.abandoned-checkout-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.abandoned-checkout-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the catalog details page. Use this to show catalog-specific settings, market information, or synchronization tools.\n */\n 'admin.catalog-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.catalog-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company details page. Use this to show B2B customer information, credit limits, or company-specific data.\n */\n 'admin.company-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the company location details page. Use this to show location-specific information, shipping preferences, or location management tools.\n */\n 'admin.company-location-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.company-location-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the gift card details page. Use this to show gift card balance tracking, usage history, or custom gift card metadata.\n */\n 'admin.gift-card-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.gift-card-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that displays inline content within the product variant details page. Use this to show variant-specific data, inventory tools, or variant configuration options.\n */\n 'admin.product-variant-details.block.render': RenderExtension<\n BlockExtensionApi<'admin.product-variant-details.block.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A block target that provides custom reordering functionality on the product details page. Use this to help merchants rearrange product data.\n */\n 'admin.product-details.reorder.render': RenderExtension<\n BlockExtensionApi<'admin.product-details.reorder.render'>,\n BlockExtensionComponents\n >;\n\n // Actions\n /**\n * An action target that appears in the **More actions** menu on the product details page. Use this to create workflows for processing products, syncing data, or integrating with external systems.\n */\n 'admin.product-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the catalog details page. Use this to create workflows for catalog management, market synchronization, or data exports.\n */\n 'admin.catalog-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.catalog-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the company details page. Use this to create workflows for B2B customer management, credit operations, or company data synchronization.\n */\n 'admin.company-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.company-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the gift card details page. Use this to create workflows for gift card processing, balance adjustments, or custom gift card operations.\n */\n 'admin.gift-card-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.gift-card-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order details page. Use this to create workflows for order processing, fulfillment operations, or external system integrations.\n */\n 'admin.order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer details page. Use this to create workflows for customer data management, loyalty operations, or CRM integrations.\n */\n 'admin.customer-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears from the **Use segment** button on the customer segment details page. Use this to create workflows for marketing campaigns, email operations, or segment-based actions.\n */\n 'admin.customer-segment-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-segment-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product index page. Use this to create workflows for product management, catalog operations, or inventory synchronization.\n */\n 'admin.product-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the order index page. Use this to create workflows for order management, reporting, or fulfillment operations.\n */\n 'admin.order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the customer index page. Use this to create workflows for customer management, marketing operations, or bulk data processing.\n */\n 'admin.customer-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page. Use this to create workflows for discount management, promotional operations, or bulk discount updates.\n */\n 'admin.discount-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection details page. Use this to create workflows for collection management, product operations, or merchandising tools.\n */\n 'admin.collection-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the collection index page. Use this to create workflows for collection management, bulk operations, or catalog organization.\n */\n 'admin.collection-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.collection-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the abandoned checkout details page. Use this to create workflows for cart recovery, customer engagement, or checkout analysis.\n */\n 'admin.abandoned-checkout-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.abandoned-checkout-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the product variant details page. Use this to create workflows for variant management, inventory operations, or data synchronization.\n */\n 'admin.product-variant-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.product-variant-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order details page. Use this to create workflows for draft order processing, custom pricing, or order preparation tools.\n */\n 'admin.draft-order-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the draft order index page. Use this to create workflows for draft order management, bulk operations, or order conversion tools.\n */\n 'admin.draft-order-index.action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount details page. Use this to create workflows for discount management, promotion analysis, or discount synchronization.\n */\n 'admin.discount-details.action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-details.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the actions menu inside the order fulfilled card, visible only on orders fulfilled by your app. Use this to create workflows for fulfillment operations, tracking updates, or post-fulfillment actions.\n */\n 'admin.order-fulfilled-card.action.render': RenderExtension<\n ActionExtensionApi<'admin.order-fulfilled-card.action.render'>,\n ActionExtensionComponents\n >;\n\n // Bulk Actions\n\n /**\n * A selection action target that appears in the **More actions** menu on the product index page when multiple products are selected. Use this to create workflows for bulk product operations, batch updates, or mass data processing.\n */\n 'admin.product-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.product-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the order index page when multiple orders are selected. Use this to create workflows for bulk order operations, batch fulfillment, or mass order processing.\n */\n 'admin.order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the customer index page when multiple customers are selected. Use this to create workflows for bulk customer operations, mass email campaigns, or batch data updates.\n */\n 'admin.customer-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.customer-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **More actions** menu on the discount index page when multiple discounts are selected. Use this to create workflows for bulk discount operations or batch data updates.\n */\n 'admin.discount-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.discount-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * A selection action target that appears in the **More actions** menu on the draft order index page when multiple draft orders are selected. Use this to create workflows for bulk draft order operations, batch conversions, or mass order processing.\n */\n 'admin.draft-order-index.selection-action.render': RenderExtension<\n ActionExtensionApi<'admin.draft-order-index.selection-action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product details page when a selling plan group is present. Use this to create workflows for subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n /**\n * An action target that appears in the **Purchase Options** card on the product variant details page when a selling plan group is present. Use this to create workflows for variant-specific subscription management, selling plan configuration, or purchase option operations.\n */\n 'admin.product-variant-purchase-option.action.render': RenderExtension<\n PurchaseOptionsCardConfigurationApi<'admin.product-variant-purchase-option.action.render'>,\n ActionExtensionComponents\n >;\n\n // Print actions and bulk print actions\n\n /**\n * A print action target that appears in the **Print** menu on the order details page. Use this to generate custom documents such as packing slips, shipping labels, or invoices.\n */\n 'admin.order-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product details page. Use this to generate custom documents such as product labels, barcode sheets, or specification sheets.\n */\n 'admin.product-details.print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-details.print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the order index page when multiple orders are selected. Use this to generate batch documents such as combined packing slips, shipping manifests, or bulk invoices.\n */\n 'admin.order-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.order-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n /**\n * A print action target that appears in the **Print** menu on the product index page when multiple products are selected. Use this to generate batch documents such as combined product labels, barcode sheets, or catalog pages.\n */\n 'admin.product-index.selection-print-action.render': RenderExtension<\n PrintActionExtensionApi<'admin.product-index.selection-print-action.render'>,\n PrintActionExtensionComponents\n >;\n\n // Other\n\n /**\n * A configuration target that renders product configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product details page. Use this to define bundle component selections, customization options, or product configuration rules.\n */\n 'admin.product-details.configuration.render': RenderExtension<\n ProductDetailsConfigurationApi<'admin.product-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A configuration target that renders product variant configuration settings for [product bundles](/docs/apps/build/product-merchandising/bundles/product-configuration-extension/add-merchant-config-ui) and customizable products on the product variant details page. Use this to define variant-specific bundle components, customization options, or configuration rules.\n */\n 'admin.product-variant-details.configuration.render': RenderExtension<\n ProductVariantDetailsConfigurationApi<'admin.product-variant-details.configuration.render'>,\n BlockExtensionComponents\n >;\n\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions.\n * @private\n */\n 'admin.settings.internal-order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.internal-order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n /**\n * A function settings target that renders within order routing settings, allowing merchants to configure order routing rule functions. Use this to build custom configuration interfaces for order routing function parameters.\n */\n 'admin.settings.order-routing-rule.render': RenderExtension<\n OrderRoutingRuleApi<'admin.settings.order-routing-rule.render'>,\n FunctionSettingsComponents\n >;\n\n /**\n * A function settings target that renders within a validation's add and edit views, allowing merchants to configure validation function settings. Use this to build custom configuration interfaces for validation function parameters and rules.\n */\n 'admin.settings.validation.render': RenderExtension<\n ValidationSettingsApi<'admin.settings.validation.render'>,\n FunctionSettingsComponents\n >;\n\n // Admin action shouldRender targets\n /**\n * A non-rendering target that controls whether the product details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the catalog details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on catalog properties, user permissions, or external data.\n */\n 'admin.catalog-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.catalog-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the company details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on company properties, user permissions, or external data.\n */\n 'admin.company-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.company-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the gift card details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on gift card properties, user permissions, or external data.\n */\n 'admin.gift-card-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.gift-card-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on order properties, fulfillment status, or external data.\n */\n 'admin.order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on customer properties, user permissions, or external data.\n */\n 'admin.customer-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer segment details action appears from the **Use segment** button. Use this to conditionally show or hide your action based on segment properties, user permissions, or external data.\n */\n 'admin.customer-segment-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-segment-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.product-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.customer-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.discount-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on collection properties, user permissions, or external data.\n */\n 'admin.collection-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the collection index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.collection-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.collection-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the abandoned checkout details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on checkout properties, user permissions, or external data.\n */\n 'admin.abandoned-checkout-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.abandoned-checkout-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product variant details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on variant properties, user permissions, or external data.\n */\n 'admin.product-variant-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-variant-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on draft order properties, user permissions, or external data.\n */\n 'admin.draft-order-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index action appears in the **More actions** menu. Use this to conditionally show or hide your action based on user permissions, store configuration, or external data.\n */\n 'admin.draft-order-index.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount details action appears in the **More actions** menu. Use this to conditionally show or hide your action based on discount properties, user permissions, or external data.\n */\n 'admin.discount-details.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-details.action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order fulfilled card action appears in the actions menu. Use this to conditionally show or hide your action based on fulfillment properties, user permissions, or external data.\n */\n 'admin.order-fulfilled-card.action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-fulfilled-card.action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin bulk action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the product index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the customer index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.customer-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.customer-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the discount index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.discount-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.discount-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the draft order index selection action appears in the **More actions** menu. Use this to conditionally show or hide your bulk action based on selection criteria, user permissions, or external data.\n */\n 'admin.draft-order-index.selection-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.draft-order-index.selection-action.should-render'>,\n ShouldRenderOutput\n >;\n\n // Admin print action and bulk print action shouldRender targets\n\n /**\n * A non-rendering target that controls whether the order details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on order properties, user permissions, or external data.\n */\n 'admin.order-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product details print action appears in the **Print** menu. Use this to conditionally show or hide your print action based on product properties, user permissions, or external data.\n */\n 'admin.product-details.print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-details.print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the order index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.order-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.order-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A non-rendering target that controls whether the product index selection print action appears in the **Print** menu. Use this to conditionally show or hide your bulk print action based on selection criteria, user permissions, or external data.\n */\n 'admin.product-index.selection-print-action.should-render': RunnableExtension<\n ShouldRenderApi<'admin.product-index.selection-print-action.should-render'>,\n ShouldRenderOutput\n >;\n\n /**\n * A runnable target that enables your app to expose data to [Sidekick](/docs/apps/build/sidekick/build-app-data). Use this target to register tools that Sidekick can invoke to search your app's data and answer merchant questions.\n */\n 'admin.app.tools.data': RunnableExtension<\n StandardApi<'admin.app.tools.data'>,\n undefined\n >;\n\n /**\n * Renders an admin extension for handling app intents.\n */\n 'admin.app.intent.render': RenderExtension<\n IntentRenderApi<'admin.app.intent.render'>,\n FormExtensionComponents\n >;\n}" } }, "RenderExtension": { @@ -917,9 +924,17 @@ "value": "string | URL", "description": "The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.", + "isOptional": true } ], - "value": "export interface Intents {\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" + "value": "export interface Intents {\n /**\n * Resolves the current intent from within an invoked extension. This property is only present when your extension is running inside an intent workflow.\n */\n response?: IntentResponseApi;\n\n /**\n * The URL that launched the current intent workflow, if your extension was opened through an intent. Use this to determine how your extension was invoked and access any parameters passed in the URL.\n */\n launchUrl?: string | URL;\n /**\n * Launches an intent workflow for creating or editing Shopify resources. Returns a handle that resolves when the merchant completes, cancels, or encounters an error in the workflow. Use this to initiate resource creation or editing without building custom forms.\n */\n invoke?: IntentInvokeApi;\n}" } }, "IntentInvokeApi": { @@ -932,6 +947,71 @@ "value": "export interface IntentInvokeApi {\n (query: IntentQuery): Promise;\n (intentURL: string, options?: IntentQueryOptions): Promise;\n}" } }, + "IntentResponseApi": { + "src/surfaces/admin/api/intents/intents.ts": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "IntentResponseApi", + "description": "The `IntentResponseApi` object provides methods for resolving the current intent from within an invoked extension. This API is only present when your extension is running inside an intent workflow.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "closed", + "value": "() => Promise", + "description": "Resolves the current intent as closed without completing the workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "error", + "value": "(message: string, issues?: Issue[]) => Promise", + "description": "Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available." + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "MethodSignature", + "name": "ok", + "value": "(data?: { [key: string]: unknown; }) => Promise", + "description": "Resolves the current intent successfully. Pass output data when your intent defines a response schema." + } + ], + "value": "export interface IntentResponseApi {\n /**\n * Resolves the current intent successfully. Pass output data when your intent defines a response schema.\n */\n ok(data?: SuccessIntentResponse['data']): Promise;\n\n /**\n * Resolves the current intent with an error. Use `issues` to provide field-specific validation details when available.\n */\n error(message: string, issues?: Issue[]): Promise;\n\n /**\n * Resolves the current intent as closed without completing the workflow.\n */\n closed(): Promise;\n}" + } + }, + "Issue": { + "src/surfaces/admin/api/intents/intents.ts": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "Issue", + "description": "A structured issue describing a validation or workflow error.", + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "code", + "value": "string", + "description": "A machine-readable error code for this issue. Use this for programmatic error handling or logging.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "message", + "value": "string", + "description": "A description of what's wrong with this field. Display this to help merchants understand how to fix the error.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "syntaxKind": "PropertySignature", + "name": "path", + "value": "string[]", + "description": "The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure.", + "isOptional": true + } + ], + "value": "export interface Issue {\n /** The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure. */\n path?: string[];\n /** A description of what's wrong with this field. Display this to help merchants understand how to fix the error. */\n message?: string;\n /** A machine-readable error code for this issue. Use this for programmatic error handling or logging. */\n code?: string;\n}" + } + }, "PickerApi": { "src/surfaces/admin/api/picker/picker.ts": { "filePath": "src/surfaces/admin/api/picker/picker.ts", @@ -1397,29 +1477,28 @@ "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Avatar", - "description": "Configure the following properties on the avatar component.", - "isPublicDocs": true, + "description": "An avatar displays a user or entity image with fallback initials when the image isn't available.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "initials", "value": "string", - "description": "The initials to display in the avatar when no image is provided or fails to load. Typically one or two characters representing a person's first and last name initials, such as \"JD\" for John Doe." + "description": "The initials to display when no image is provided or if the image fails to load." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The URL or path to the avatar image. When provided, the image takes priority over `initials`. If the image fails to load or loads slowly, `initials` will be rendered as a fallback." + "description": "The URL of the avatar image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"base\" | \"large\" | \"large-200\"", - "description": "The size of the avatar image.\n\n- `small-200`: Extra small avatar, suitable for compact displays or lists with many items.\n- `small`: Small avatar, good for secondary contexts or tight layouts.\n- `base`: Default size that works well in most contexts.\n- `large`: Large avatar for emphasis or when the avatar is a focal point.\n- `large-200`: Extra large avatar for prominent display.", + "description": "The size of the avatar.", "defaultValue": "'base'" }, { @@ -1427,7 +1506,14 @@ "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the avatar for accessibility.\n\nProvides a text description of the avatar for users with assistive technology and serves as a fallback when the avatar fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an avatar, it reads this description aloud. When an avatar fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt)." + "description": "Alternative text that describes the avatar for screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -1474,7 +1560,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -1482,11 +1568,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Avatar extends PreactCustomElement implements AvatarProps {\n accessor initials: AvatarProps['initials'];\n accessor src: AvatarProps['src'];\n accessor size: AvatarProps['size'];\n accessor alt: AvatarProps['alt'];\n constructor();\n}" + "value": "declare class Avatar extends PolarisCustomElement implements AvatarProps {\n /**\n * The initials to display when no image is provided or if the image fails to load.\n */\n initials: AvatarProps['initials'];\n /**\n * The URL of the avatar image to display.\n */\n src: AvatarProps['src'];\n /**\n * The size of the avatar.\n */\n size: AvatarProps['size'];\n /**\n * Alternative text that describes the avatar for screen readers.\n */\n alt: AvatarProps['alt'];\n constructor();\n}" } }, "ClickOptions": { @@ -1494,7 +1595,6 @@ "filePath": "src/surfaces/admin/components.ts", "name": "ClickOptions", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -1519,70 +1619,77 @@ "syntaxKind": "PropertySignature", "name": "button", "value": "number", - "description": "The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "ctrlKey", "value": "boolean", - "description": "Whether the Ctrl key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "metaKey", "value": "boolean", - "description": "Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred." + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "shiftKey", "value": "boolean", - "description": "Whether the Shift key was pressed when the event occurred." + "description": "" } ], - "value": "export interface ActivationEventEsque {\n /**\n * Whether the Shift key was pressed when the event occurred.\n */\n shiftKey: boolean;\n /**\n * Whether the Meta/Command key (Mac) or Windows key was pressed when the event occurred.\n */\n metaKey: boolean;\n /**\n * Whether the Ctrl key was pressed when the event occurred.\n */\n ctrlKey: boolean;\n /**\n * The button number that was pressed on the mouse. 0 for left button, 1 for middle button, 2 for right button.\n */\n button: number;\n}" + "value": "export interface ActivationEventEsque {\n shiftKey: boolean;\n metaKey: boolean;\n ctrlKey: boolean;\n button: number;\n}" } }, "Badge": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Badge", - "description": "Configure the following properties on the badge component.", - "isPublicDocs": true, + "description": "The badge custom element class that renders status indicators in the Shopify admin interface. This component displays compact visual indicators with customizable tones, sizes, and optional icons to communicate status information to merchants.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"strong\"", - "description": "Controls the visual weight and emphasis of the badge.\n\n- `base`: Standard weight with moderate emphasis, suitable for most use cases.\n- `strong`: Increased visual weight for higher emphasis and prominence.", - "defaultValue": "'base'" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the badge to provide additional visual context or reinforce the badge's meaning. Accepts any icon name from the icon library or a custom string identifier." + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"strong\"", + "description": "The visual weight of the badge. Available options: `'base'` for standard weight or `'strong'` for increased emphasis.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the badge.\n\n- `base`: Default size suitable for most badge use cases.\n- `large`: Larger badge for increased visibility and prominence.\n- `large-100`: Extra large badge for maximum visibility in emphasized contexts.", + "description": "The size of the badge. Available options: `'base'` for standard size, `'large'` for larger size, or `'large-100'` for extra large size.", "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", - "defaultValue": "'auto'" + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -1629,7 +1736,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -1637,19 +1744,42 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Badge extends PreactCustomElement implements BadgeProps {\n accessor color: BadgeProps['color'];\n accessor icon: BadgeProps['icon'];\n accessor size: BadgeProps['size'];\n accessor tone: BadgeProps['tone'];\n constructor();\n}" + "value": "declare class Badge extends BadgeBase implements BadgeProps {\n /**\n * The icon to display inside the badge. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: BadgeProps['icon'];\n /**\n * The tone that determines the badge's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, `'info'`, `'success'`, `'caution'`, `'warning'`, or `'critical'`.\n */\n tone: BadgeProps['tone'];\n constructor();\n}" + } + }, + "IconType": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "IconType", + "value": "'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'align-horizontal-centers' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'brain' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'channels-filled' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code' | 'code-add' | 'collection' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color' | 'color-none' | 'compass' | 'complete' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'edit' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'incomplete' | 'info' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'layer' | 'lightbulb' | 'link' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replace' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'select' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'split' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-cart' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", + "description": "" } }, "Banner": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Banner", - "description": "Configure the following properties on the banner component.", - "isPublicDocs": true, + "description": "A custom element for displaying important messages and notifications.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -1664,7 +1794,7 @@ "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.", + "description": "The color tone of the banner based on its semantic meaning.", "defaultValue": "'auto'" }, { @@ -1672,7 +1802,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Controls whether the banner is visible or hidden.\n\nWhen using a controlled component pattern and the banner is `dismissible`, update this property to `true` when the `dismiss` event fires.\n\nYou can hide the banner programmatically by setting this to `true` even if it's not `dismissible`.", + "description": "Whether the banner is hidden from view.", "defaultValue": "false" }, { @@ -1680,9 +1810,16 @@ "syntaxKind": "PropertyDeclaration", "name": "dismissible", "value": "boolean", - "description": "Whether the banner displays a close button that allows users to dismiss it.\n\nWhen the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, any animation completes, and the `afterhide` event fires.", + "description": "Whether the banner can be dismissed by the user.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -1728,7 +1865,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -1736,26 +1873,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Banner extends PreactCustomElement implements BannerProps {\n accessor heading: BannerProps['heading'];\n accessor tone: BannerProps['tone'];\n accessor hidden: BannerProps['hidden'];\n accessor dismissible: BannerProps['dismissible'];\n constructor();\n}" + "value": "declare class Banner extends PolarisCustomElement implements BannerProps {\n /**\n * The heading text displayed at the top of the banner.\n */\n heading: BannerProps['heading'];\n /**\n * The color tone of the banner based on its semantic meaning.\n */\n tone: BannerProps['tone'];\n /**\n * Whether the banner is hidden from view.\n */\n hidden: BannerProps['hidden'];\n /**\n * Whether the banner can be dismissed by the user.\n */\n dismissible: BannerProps['dismissible'];\n constructor();\n}" } }, "Box": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Box", - "description": "Configure the following properties on the box component.", - "isPublicDocs": true, + "description": "A box is a container component that provides control over layout, spacing, and styling.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -1763,7 +1914,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -1771,7 +1922,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -1779,7 +1930,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -1787,7 +1938,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -1795,7 +1946,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -1803,7 +1954,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -1811,7 +1962,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -1819,7 +1970,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -1827,7 +1978,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -1835,7 +1986,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1843,7 +1994,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1851,7 +2002,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1859,7 +2010,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1867,7 +2018,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1875,7 +2026,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -1883,7 +2034,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -1903,7 +2054,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -1911,7 +2062,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -1919,7 +2070,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -1927,7 +2078,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -1935,14 +2086,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -1950,9 +2101,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -1998,7 +2156,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2006,8 +2164,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Box extends BoxElement implements BoxProps {\n constructor();\n}" @@ -2018,9 +2191,8 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "AccessibilityRole", - "value": "'main' | 'header' | 'footer' | 'section' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", - "description": "Defines the semantic role of a component for assistive technologies like screen readers.\n\nAccessibility roles help users with disabilities understand the purpose and structure of content. These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation.\n\nUse these roles to:\n- Improve navigation for screen reader users\n- Provide semantic structure to your UI\n- Ensure proper interpretation by assistive technologies\n\nLearn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs.\n\n- `main`: Indicates the primary content area of the page.\n- `header`: Marks a component as a header containing introductory content or navigation.\n- `footer`: Designates content containing information like copyright, navigation links, or privacy statements.\n- `section`: Defines a generic thematic grouping of content that should have a heading or accessible label.\n- `aside`: Marks supporting content that relates to but is separate from the main content.\n- `navigation`: Identifies major groups of navigation links for moving around the site or page.\n- `ordered-list`: Represents a list where the order of items is meaningful.\n- `list-item`: Identifies an individual item within a list.\n- `list-item-separator`: Acts as a visual and semantic divider between items in a list.\n- `unordered-list`: Represents a list where the order of items is not meaningful.\n- `separator`: Creates a divider that separates and distinguishes sections of content.\n- `status`: Defines a live region for advisory information that is not urgent enough to be an alert.\n- `alert`: Marks important, time-sensitive information that requires the user's immediate attention.\n- `generic`: Creates a semantically neutral container element with no inherent meaning.\n- `presentation`: Removes semantic meaning from an element while preserving its visual appearance.\n- `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling.", - "isPublicDocs": true + "value": "'main' | 'header' | 'footer' | 'section' | 'region' | 'aside' | 'navigation' | 'ordered-list' | 'list-item' | 'list-item-separator' | 'unordered-list' | 'separator' | 'status' | 'alert' | 'generic' | 'presentation' | 'none'", + "description": "" } }, "BackgroundColorKeyword": { @@ -2029,8 +2201,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BackgroundColorKeyword", "value": "'transparent' | ColorKeyword", - "description": "Defines the background color intensity or emphasis level for UI elements.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isPublicDocs": true + "description": "" } }, "ColorKeyword": { @@ -2039,8 +2210,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "ColorKeyword", "value": "'subdued' | 'base' | 'strong'", - "description": "Defines the color intensity or emphasis level for text and UI elements.\n\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence.", - "isPublicDocs": true + "description": "" } }, "SizeUnitsOrAuto": { @@ -2049,8 +2219,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrAuto", "value": "SizeUnits | 'auto'", - "description": "Represents size values that can also be set to `auto` for automatic sizing.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isPublicDocs": true + "description": "" } }, "SizeUnits": { @@ -2059,8 +2228,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnits", "value": "`${number}px` | `${number}%` | `0`", - "description": "Represents size values in pixels, percentages, or zero.\n\n- `${number}px`: Absolute size in pixels for fixed dimensions (such as `100px`, `24px`).\n- `${number}%`: Relative size as a percentage of the parent container (such as `50%`, `100%`).\n- `0`: Zero size, equivalent to no dimension.", - "isPublicDocs": true + "description": "" } }, "SizeUnitsOrNone": { @@ -2069,8 +2237,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "SizeUnitsOrNone", "value": "SizeUnits | 'none'", - "description": "Represents size values that can also be set to `none` to remove the size constraint.\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `none`: No size constraint, allowing unlimited growth.", - "isPublicDocs": true + "description": "" } }, "MaybeResponsive": { @@ -2079,8 +2246,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "MaybeResponsive", "value": "T | `@container${string}`", - "description": "Makes a property responsive by allowing it to be set conditionally based on container query conditions. The value can be either a base value or a container query string.\n\n- `T`: Base value that applies in all conditions.\n- `@container${string}`: Container query string for conditional responsive styling based on container size.", - "isPublicDocs": true + "description": "" } }, "MaybeAllValuesShorthandProperty": { @@ -2089,8 +2255,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "MaybeAllValuesShorthandProperty", "value": "T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one to four values. Supports specifying values for all four sides: top, right, bottom, and left.\n\n- `T`: Single value that applies to all four sides.\n- `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right).\n- `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom).\n- `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left).", - "isPublicDocs": true + "description": "" } }, "PaddingKeyword": { @@ -2099,8 +2264,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "PaddingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the padding size for elements, using the standard size scale or `none` for no padding.\n\n- `SizeKeyword`: Standard padding sizes from the size scale for consistent spacing.\n- `none`: No padding.", - "isPublicDocs": true + "description": "" } }, "SizeKeyword": { @@ -2109,8 +2273,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "SizeKeyword", "value": "'small-500' | 'small-400' | 'small-300' | 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'large-200' | 'large-300' | 'large-400' | 'large-500'", - "description": "Defines component sizes using a consistent scale from extra small to extra large.\n\n- `small-500` through `small-100`: Extra small to small sizes, progressively increasing.\n- `small`: Standard small size.\n- `base`: Default medium size that works well in most contexts.\n- `large`: Standard large size.\n- `large-100` through `large-500`: Large to extra large sizes, progressively increasing.", - "isPublicDocs": true + "description": "" } }, "MaybeTwoValuesShorthandProperty": { @@ -2119,8 +2282,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "MaybeTwoValuesShorthandProperty", "value": "T | `${T} ${T}`", - "description": "Represents CSS shorthand properties that accept one or two values. Supports specifying the same value for both dimensions or different values.\n\n- `T`: Single value that applies to both dimensions.\n- `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal).", - "isPublicDocs": true + "description": "" } }, "BorderShorthand": { @@ -2129,8 +2291,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BorderShorthand", "value": "BorderSizeKeyword | `${BorderSizeKeyword} ${ColorKeyword}` | `${BorderSizeKeyword} ${ColorKeyword} ${BorderStyleKeyword}`", - "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style.", - "isPublicDocs": true + "description": "Represents a shorthand for defining a border. It can be a combination of size, optionally followed by color, optionally followed by style." } }, "BorderSizeKeyword": { @@ -2139,8 +2300,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BorderSizeKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the width of borders, using the standard size scale or `none` for no border.\n\n- `SizeKeyword`: Standard border widths from the size scale for consistent thickness.\n- `none`: No border width (removes the border).", - "isPublicDocs": true + "description": "" } }, "BorderStyleKeyword": { @@ -2149,8 +2309,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BorderStyleKeyword", "value": "'none' | 'solid' | 'dashed' | 'dotted' | 'auto'", - "description": "Defines the visual style of borders.\n\n- `none`: No border is displayed.\n- `solid`: A single solid line.\n- `dashed`: A series of short dashes.\n- `dotted`: A series of dots.\n- `auto`: Automatically determined based on context.", - "isPublicDocs": true + "description": "" } }, "BoxBorderStyles": { @@ -2159,7 +2318,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderStyles", "value": "'auto' | 'none' | 'solid' | 'dashed'", - "description": "Represents the subset of border style values supported by the box component.\n\n- `auto`: Default border style determined by the system.\n- `none`: No border style (removes the border).\n- `solid`: Continuous line border.\n- `dashed`: Border made up of dashes.", + "description": "The allowed border style values for a box component.", "isPublicDocs": true } }, @@ -2169,7 +2328,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BoxBorderRadii", "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100' | 'large-200' | 'none'", - "description": "Represents the subset of border radius values supported by the component.\n\n- `small-200`: Extra small radius for subtle rounding.\n- `small-100`: Small radius for minimal corner rounding.\n- `small`: Standard small radius.\n- `base`: Medium radius for moderate corner rounding.\n- `large`: Standard large radius for pronounced rounding.\n- `large-100`: Large radius for more prominent corner rounding.\n- `large-200`: Extra large radius for maximum rounding.\n- `none`: No border radius (sharp corners).", + "description": "The allowed border radius values for a box component.", "isPublicDocs": true } }, @@ -2177,54 +2336,54 @@ "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Button", - "description": "Configure the following properties on the button component.", - "isPublicDocs": true, + "description": "The button custom element class that renders interactive buttons in the Shopify admin interface. This component triggers actions or navigation when clicked, with customizable visual styles, states, and optional icons.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "disabled", - "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", - "defaultValue": "false" + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier." + "name": "variant", + "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", + "description": "The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.", + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "loading", - "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", - "defaultValue": "false" + "name": "tone", + "value": "\"critical\" | \"auto\" | \"neutral\"", + "description": "The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "variant", - "value": "\"auto\" | \"primary\" | \"secondary\" | \"tertiary\"", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "defaultValue": "'auto'" + "name": "disabled", + "value": "boolean", + "description": "Whether the button is disabled, preventing any interaction. When `true`, the button appears visually disabled and doesn't respond to user clicks.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "defaultValue": "'auto'" + "name": "loading", + "value": "boolean", + "description": "Whether the button is in a loading state. When `true`, displays a loading indicator and prevents interaction to show that an action is in progress.", + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to open the linked document when the button acts as a link. Available options: `''`, `'_blank'`, `'_self'`, `'_parent'`, or `'_top'`.", "defaultValue": "'auto'" }, { @@ -2232,21 +2391,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "A URL that the button should navigate to when clicked. When provided, the button behaves as a link." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Prompts the user to save the linked URL as a file with the specified filename. Only works when `href` is provided." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The button's behavior in forms. Available options: `'button'`, `'submit'`, or `'reset'`.", "defaultValue": "'button'" }, { @@ -2254,7 +2413,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the button's purpose for screen readers. This is essential for accessibility when the button doesn't have visible text." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "inlineSize", + "value": "\"auto\" | \"fill\" | \"fit-content\"", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -2301,7 +2475,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2309,15 +2483,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -2325,17 +2514,17 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Button extends Button_base implements ButtonProps {\n accessor disabled: ButtonProps['disabled'];\n accessor icon: ButtonProps['icon'];\n accessor loading: ButtonProps['loading'];\n accessor variant: ButtonProps['variant'];\n accessor tone: ButtonProps['tone'];\n accessor target: ButtonProps['target'];\n accessor href: ButtonProps['href'];\n accessor download: ButtonProps['download'];\n accessor type: ButtonProps['type'];\n accessor accessibilityLabel: ButtonProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Button\n extends ButtonBase\n implements ButtonProps\n{\n /**\n * The icon to display inside the button. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.\n */\n icon: ButtonProps['icon'];\n /**\n * The visual style variant of the button that determines its emphasis. Available options: `'primary'`, `'secondary'`, `'tertiary'`, or `'plain'`.\n */\n variant: ButtonProps['variant'];\n /**\n * The tone that determines the button's visual appearance and semantic meaning. Available options: `'auto'`, `'neutral'`, or `'critical'`.\n */\n tone: ButtonProps['tone'];\n constructor();\n}" } }, "AnyString": { @@ -2344,23 +2533,21 @@ "syntaxKind": "TypeAliasDeclaration", "name": "AnyString", "value": "string & {}", - "description": "A utility type that enables autocomplete for specific string literals while still accepting any string value. By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, preserving IDE suggestions for known values while maintaining flexibility for custom strings.", - "isPublicDocs": true + "description": "Prevents widening string literal types in a union to `string`." } }, "ButtonGroup": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "ButtonGroup", - "description": "Configure the following properties on the button group component.", - "isPublicDocs": true, + "description": "A button group that arranges multiple buttons together with consistent spacing and semantic grouping for related actions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "\"base\" | \"none\"", - "description": "The spacing between buttons in the group.\n\n- `base`: Standard spacing that provides clear visual separation between buttons.\n- `none`: No spacing, creating a connected button group.", + "description": "The amount of spacing between buttons in the group, affecting the visual separation of actions.", "defaultValue": "'base'" }, { @@ -2368,7 +2555,21 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, describing the purpose of this group of buttons." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -2394,14 +2595,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -2415,7 +2608,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2423,41 +2616,70 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ButtonGroup\n extends PreactCustomElement\n implements ButtonGroupProps\n{\n accessor gap: ButtonGroupProps['gap'];\n accessor accessibilityLabel: ButtonGroupProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class ButtonGroup extends ButtonGroupBase implements ButtonGroupProps {\n constructor();\n}" } }, "Checkbox": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Checkbox", - "description": "Configure the following properties on the checkbox component.", - "isPublicDocs": true, + "description": "A checkbox that lets users select or deselect an option, with support for an indeterminate state.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "indeterminate", "value": "boolean", - "description": "Whether the checkbox displays in an indeterminate state (neither checked nor unchecked), typically used to indicate partial selection in hierarchical lists.\n\nThis visual state takes priority over the `checked` prop in appearance only. The form submission value is still determined by the `checked` prop.\n\nIf `indeterminate` has not been explicitly set and hasn't been modified by user interaction, it returns the value of `defaultIndeterminate`." + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultIndeterminate", "value": "boolean", - "description": "The initial indeterminate state for uncontrolled components. Use this when you want the checkbox to start in an indeterminate state but don't need to control it afterward.\n\nThis value applies until `indeterminate` is explicitly set or the user changes the checkbox state by clicking.", + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "labelAccessibilityVisibility", + "value": "\"visible\" | \"exclusive\"", + "description": "", + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -2472,7 +2694,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -2480,28 +2702,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -2524,7 +2746,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -2532,23 +2754,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@6805", + "name": "__@internals$4@2293", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -2594,7 +2823,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2602,26 +2831,49 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Checkbox extends PreactCheckboxElement implements CheckboxProps {\n get indeterminate(): CheckboxProps['indeterminate'];\n set indeterminate(indeterminate: CheckboxProps['indeterminate']);\n accessor defaultIndeterminate: CheckboxProps['defaultIndeterminate'];\n constructor();\n}" + "value": "declare class Checkbox extends CheckboxBase implements CheckboxProps {\n constructor();\n}" + } + }, + "CallbackEvent": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CallbackEvent", + "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", + "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event." } }, "Chip": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Chip", - "description": "Configure the following properties on the chip component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "Modify the color to be more or less intense.", "defaultValue": "'base'" }, { @@ -2629,7 +2881,22 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -2676,7 +2943,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2684,26 +2951,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Chip extends PreactCustomElement implements ChipProps {\n accessor color: ChipProps['color'];\n accessor accessibilityLabel: ChipProps['accessibilityLabel'];\n constructor();\n}" + "value": "declare class Chip extends PolarisCustomElement implements ChipProps {\n color: ChipProps['color'];\n accessibilityLabel: ChipProps['accessibilityLabel'];\n removable: ChipProps['removable'];\n constructor(renderImpl?: Omit);\n}" } }, "Choice": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Choice", - "description": "The choice component creates individual selectable options within a choice list. Use choice to define each option that merchants can select, supporting both single selection (radio buttons) and multiple selection (checkboxes) modes.\n\nChoice components support labels, help text, and custom content through slots, providing flexible option presentation within choice lists.", - "isPublicDocs": true, + "description": "A single choice within a choice list that can be selected with a radio button or checkbox.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the choice is disabled and can't be selected.", "defaultValue": "false" }, { @@ -2711,7 +2992,7 @@ "syntaxKind": "GetAccessor", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the choice is currently selected.", "defaultValue": "false" }, { @@ -2719,21 +3000,21 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this choice is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that's only visible to screen readers, used when the visual label isn't descriptive enough." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the choice should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -2752,6 +3033,13 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -2781,7 +3069,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2789,26 +3077,56 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Choice extends PreactCustomElement implements ChoiceProps {\n accessor disabled: ChoiceProps['disabled'];\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n accessor value: ChoiceProps['value'];\n accessor accessibilityLabel: ChoiceProps['accessibilityLabel'];\n accessor defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Choice extends PolarisCustomElement implements ChoiceProps {\n /**\n * Whether the choice is disabled and can't be selected.\n */\n disabled: ChoiceProps['disabled'];\n /**\n * Whether the choice is currently selected.\n */\n get selected(): boolean;\n set selected(selected: ChoiceProps['selected']);\n /**\n * The value that's submitted with the form when this choice is selected.\n */\n value: ChoiceProps['value'];\n /**\n * A label that's only visible to screen readers, used when the visual label isn't descriptive enough.\n */\n accessibilityLabel: ChoiceProps['accessibilityLabel'];\n /**\n * Whether the choice should be selected when it's first rendered.\n */\n defaultSelected: ChoiceProps['defaultSelected'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" } }, "ChoiceList": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "ChoiceList", - "description": "Configure the following properties on the choice list component.", - "isPublicDocs": true, + "description": "A list of choices that lets users select one or more options using radio buttons or checkboxes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "addEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", + "description": "Wraps change and input event listeners so they only fire when the event was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n\nThis prevents form events from elements inside secondary content (e.g. TextField, native ) from being mistakenly treated as ChoiceList value-change events, while still allowing those events to bubble normally through the DOM (preserving React's event delegation).", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "removeEventListener", + "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction. When `true`, the `disabled` property on any child choices is ignored.", + "description": "Whether all choices in the list are disabled and can't be selected.", "defaultValue": "false" }, { @@ -2816,43 +3134,43 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name that identifies this choice list when the form is submitted." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the choice list when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the choice list." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "multiple", "value": "boolean", - "description": "Whether multiple choices can be selected.", + "description": "Whether users can select more than one choice at a time.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the choice list is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -2860,7 +3178,7 @@ "syntaxKind": "GetAccessor", "name": "values", "value": "string[]", - "description": "An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected." + "description": "The values of the currently selected choices." }, { "filePath": "src/surfaces/admin/components.ts", @@ -2889,11 +3207,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$3@6858", + "name": "__@internals$3@2369", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -2923,7 +3248,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -2931,40 +3256,54 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ChoiceList extends BaseClass$3 implements ChoiceListProps {\n accessor disabled: ChoiceListProps['disabled'];\n accessor name: ChoiceListProps['name'];\n accessor error: ChoiceListProps['error'];\n accessor details: ChoiceListProps['details'];\n accessor multiple: ChoiceListProps['multiple'];\n accessor label: ChoiceListProps['label'];\n accessor labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class ChoiceList extends BaseClass$1 implements ChoiceListProps {\n /**\n * Wraps change and input event listeners so they only fire when the event\n * was dispatched directly on this ChoiceList (event.eventPhase === Event.AT_TARGET).\n *\n * This prevents form events from elements inside secondary content (e.g.\n * TextField, native ) from being mistakenly treated as ChoiceList\n * value-change events, while still allowing those events to bubble normally\n * through the DOM (preserving React's event delegation).\n * @private\n */\n addEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: AddEventListenerOptions | boolean,\n ): void;\n\n /** @private */\n removeEventListener(\n type: string,\n callback: EventListenerOrEventListenerObject | null,\n options?: EventListenerOptions | boolean,\n ): void;\n\n /**\n * Whether all choices in the list are disabled and can't be selected.\n */\n disabled: ChoiceListProps['disabled'];\n /**\n * The name that identifies this choice list when the form is submitted.\n */\n name: ChoiceListProps['name'];\n /**\n * An error message that's displayed below the choice list when validation fails.\n */\n error: ChoiceListProps['error'];\n /**\n * Additional text to provide context or guidance for the choice list.\n */\n details: ChoiceListProps['details'];\n /**\n * Whether users can select more than one choice at a time.\n */\n multiple: ChoiceListProps['multiple'];\n /**\n * The text that describes what the choice list is for.\n */\n label: ChoiceListProps['label'];\n /**\n * Controls whether the label is visible to all users or only to screen readers.\n */\n labelAccessibilityVisibility: ChoiceListProps['labelAccessibilityVisibility'];\n /**\n * The values of the currently selected choices.\n */\n get values(): ChoiceListProps['values'];\n set values(values: ChoiceListProps['values']);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" } }, "Clickable": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Clickable", - "description": "Configure the following properties on the clickable component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the component is disabled, preventing clicks and focus. When disabled, the `click` event won't fire and click events from child elements stop propagating immediately. Interactive child elements can still receive focus and be interacted with. This doesn't apply visual styling by default. You shouldapply disabled styling as needed." + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the component is in a loading state, which indicates to assistive technology that an action is in progress and prevents interaction." + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -2972,21 +3311,21 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"button\" | \"reset\" | \"submit\"", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "defaultValue": "'button'" }, { @@ -2994,7 +3333,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -3002,7 +3341,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -3010,7 +3349,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -3018,7 +3357,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -3026,7 +3365,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -3034,7 +3373,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -3042,7 +3381,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -3050,7 +3389,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -3058,7 +3397,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -3066,7 +3405,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -3074,7 +3413,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -3082,7 +3421,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -3090,7 +3429,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -3098,7 +3437,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -3106,7 +3445,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -3114,7 +3453,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -3122,7 +3461,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -3142,7 +3481,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -3150,7 +3489,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -3158,7 +3497,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -3166,7 +3505,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -3174,14 +3513,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -3189,9 +3528,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -3237,7 +3583,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -3245,15 +3591,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -3261,32 +3622,31 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n accessor disabled: ClickableProps['disabled'];\n accessor loading: ClickableProps['loading'];\n accessor target: ClickableProps['target'];\n accessor href: ClickableProps['href'];\n accessor download: ClickableProps['download'];\n accessor type: ClickableProps['type'];\n constructor();\n}" + "value": "declare class Clickable extends Clickable_base implements ClickableProps {\n disabled: ClickableProps['disabled'];\n loading: ClickableProps['loading'];\n target: ClickableProps['target'];\n href: ClickableProps['href'];\n download: ClickableProps['download'];\n type: ClickableProps['type'];\n constructor();\n}" } }, "ClickableChip": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "ClickableChip", - "description": "Configure the following properties on the clickable chip component.", - "isPublicDocs": true, + "description": "A custom element for displaying interactive chips that can be clicked or removed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "description": "The color of the chip.", "defaultValue": "'base'" }, { @@ -3294,14 +3654,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A text description of the chip for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "removable", "value": "boolean", - "description": "Whether the chip displays a remove button for dismissal. When clicked, the `remove` callback fires.", + "description": "Whether the chip can be removed by the user.", "defaultValue": "false" }, { @@ -3309,7 +3669,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hidden", "value": "boolean", - "description": "Whether the chip is hidden from view. When using controlled component pattern with `removable` chips, update this property when the `remove` event fires. For non-removable chips, manually toggle this property to show or hide the chip.", + "description": "Whether the chip is hidden from view.", "defaultValue": "false" }, { @@ -3317,7 +3677,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the chip is disabled, preventing any user interaction.", + "description": "Whether the chip is disabled and can't be clicked.", "defaultValue": "false" }, { @@ -3325,7 +3685,14 @@ "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to navigate to when the chip is clicked." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -3372,7 +3739,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -3380,15 +3747,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -3396,32 +3778,31 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class ClickableChip\n extends ClickableChip_base\n implements ClickableChipProps\n{\n accessor color: ClickableChipProps['color'];\n accessor accessibilityLabel: ClickableChipProps['accessibilityLabel'];\n accessor removable: ClickableChipProps['removable'];\n accessor hidden: ClickableChipProps['hidden'];\n accessor disabled: ClickableChipProps['disabled'];\n accessor href: ClickableChipProps['href'];\n constructor();\n}" + "value": "declare class ClickableChip\n extends ClickableChipBase\n implements ClickableChipProps\n{\n /**\n * The color of the chip.\n */\n color: ClickableChipProps['color'];\n constructor();\n}" } }, "ColorField": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorField", - "description": "Configure the following properties on the color field component.", - "isPublicDocs": true, + "description": "The color field custom element class that renders a color input field with integrated visual picker in the Shopify admin interface. This component allows merchants to select colors by typing hex values or using an interactive color picker, with optional support for transparency (alpha channel).", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -3429,7 +3810,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", @@ -3452,7 +3833,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\"", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -3460,35 +3841,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -3496,14 +3877,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -3511,7 +3892,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -3535,7 +3916,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -3551,7 +3932,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -3559,23 +3940,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@6805", + "name": "__@internals$4@2293", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -3613,7 +4001,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -3621,26 +4009,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ColorField\n extends PreactFieldElement\n implements ColorFieldProps\n{\n accessor alpha: ColorFieldProps['alpha'];\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n /** @private */\n setInternalValue(value: string, normalize: boolean): void;\n}" + "value": "declare class ColorField extends ColorFieldBase implements ColorFieldProps {\n constructor();\n}" } }, "ColorPicker": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "ColorPicker", - "description": "Configure the following properties on the color picker component.", - "isPublicDocs": true, + "description": "A visual color picker component that allows users to select colors from a color spectrum interface.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alpha", "value": "boolean", - "description": "Whether to enable alpha (transparency) channel selection in the color picker, allowing users to choose semi-transparent colors.", + "description": "Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.", "defaultValue": "false" }, { @@ -3648,156 +4050,140 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial color value when the field first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts interacting, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected color value. Accepts multiple input formats:\n\n- Hex: `#RGB`, `#RRGGBB`, `#RRGGBBAA` (3, 6, or 8 digits)\n- RGB/RGBA: `rgb(255, 0, 0)` or `rgb(255 0 0)` (comma or space-separated)\n- HSL/HSLA: `hsl(0, 100%, 50%)` or `hsl(0 100% 50%)`\n\nReturns an empty string if the value is invalid. The `change` event always emits values in hex format." + "description": "The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", "name": "formResetCallback", "value": "() => void", - "description": "A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@internals$2@6959", - "value": "ElementInternals", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", "description": "", "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true } ], - "value": "declare class ColorPicker extends BaseClass$2 implements ColorPickerProps {\n accessor alpha: boolean;\n accessor name: string;\n accessor defaultValue: string;\n get value(): string;\n set value(value: string);\n /**\n * A callback that fires when the containing form is reset (using the form's `reset()` method or a reset button). When triggered, the component's `value` reverts to its `defaultValue`.\n */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class ColorPicker extends BaseClass implements ColorPickerProps {\n /**\n * Whether the color picker includes an alpha (transparency) channel for selecting semi-transparent colors.\n *\n * @default false\n */\n alpha: boolean;\n /**\n * The name of the picker, used when submitting form data.\n */\n name: string;\n /**\n * The initial color value when the picker first renders, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n defaultValue: string;\n /**\n * The current color value, formatted as a hex color string (e.g., `#FF0000` or `#FF0000FF` with alpha).\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n constructor();\n}" } }, "DateField": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "DateField", - "description": "Configure the following properties on the date field component.", - "isPublicDocs": true, + "description": "The date field custom element class that renders a date input field with integrated calendar picker in the Shopify admin interface. This component allows merchants to select dates by typing or using a visual calendar, with support for date range restrictions and day-of-week constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "disallowDays", - "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "disallowDays", + "value": "string", + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar picker, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar picker first opens, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "DateAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -3805,36 +4191,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "defaultValue": "\"\"" + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -3842,14 +4227,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -3857,7 +4242,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -3881,7 +4266,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -3905,7 +4290,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -3913,31 +4298,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The currently selected date in `YYYY-MM-DD` format. An empty string means no date is selected.", - "defaultValue": "\"\"" + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@6805", + "name": "__@internals$4@2293", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -3975,7 +4366,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -3983,11 +4374,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DateField\n extends PreactFieldElement\n implements DateFieldProps\n{\n accessor allow: DateFieldProps['allow'];\n accessor disallow: DateFieldProps['disallow'];\n accessor allowDays: DateFieldProps['allowDays'];\n accessor disallowDays: DateFieldProps['disallowDays'];\n set view(view: string);\n get view(): string;\n accessor defaultView: DateFieldProps['defaultView'];\n constructor();\n}" + "value": "declare class DateField extends DateFieldBase implements DateFieldProps {\n constructor();\n}" } }, "DateAutocompleteField": { @@ -3996,69 +4402,115 @@ "syntaxKind": "TypeAliasDeclaration", "name": "DateAutocompleteField", "value": "'bday-day' | 'bday-month' | 'bday-year' | 'bday' | 'cc-expiry-month' | 'cc-expiry-year' | 'cc-expiry'", - "description": "Represents autocomplete values that are valid for date input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for date-based inputs.\n\nAvailable values:\n- `bday` - Complete birthday date\n- `bday-day` - Day component of a birthday (1-31)\n- `bday-month` - Month component of a birthday (1-12)\n- `bday-year` - Year component of a birthday (1990)\n- `cc-expiry` - Complete credit card expiration date\n- `cc-expiry-month` - Month component of a credit card expiration date (1-12)\n- `cc-expiry-year` - Year component of a credit card expiration date (2025)", - "isPublicDocs": true + "description": "" } }, "DatePicker": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "DatePicker", - "description": "Configure the following properties on the date picker component.", - "isPublicDocs": true, + "description": "The date picker custom element class that renders a standalone calendar interface in the Shopify admin. This component allows merchants to select single dates or date ranges using an interactive calendar with month/year navigation, date constraints, and day-of-week restrictions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultView", "value": "string", - "description": "The default month to display in `YYYY-MM` format. Used until the `view` callback is set by user interaction or programmatically. Defaults to the current month in the user's locale." + "description": "The initial month and year shown when the calendar first renders, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "view", "value": "string", - "description": "The currently displayed month in `YYYY-MM` format. When changed, the `viewchange` callback is triggered. Defaults to `defaultView`." + "description": "The currently visible month and year in the calendar, formatted as an ISO 8601 date string." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allow", "value": "string", - "description": "Specifies which dates can be selected as a comma-separated list. An empty string (default) allows all dates.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `2024-02--2025`: February 2024 through end of 2025\n- `2024-05-09, 2024-05-11`: Only May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that are allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallow", "value": "string", - "description": "Specifies which dates can't be selected as a comma-separated list. These dates are excluded from those specified in `allow`. An empty string (default) has no effect.\n\n**Formats:**\n- `YYYY-MM-DD`: Single date\n- `YYYY-MM`: Whole month\n- `YYYY`: Whole year\n- `start--end`: Date range (inclusive, unbounded if start/end omitted)\n\n**Examples:**\n- `--2024-02`: All dates before February 2024\n- `2024-05-09, 2024-05-11`: May 9th and 11th, 2024", - "defaultValue": "\"\"" + "description": "The dates that aren't allowed to be selected, specified as ISO 8601 date strings or date ranges.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "allowDays", "value": "string", - "description": "Specifies which days of the week can be selected as a comma-separated list. Further restricts dates from `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (only weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that are allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disallowDays", "value": "string", - "description": "Specifies which days of the week can't be selected as a comma-separated list. Excludes days from `allowDays` and intersects with `allow` and `disallow`. An empty string (default) has no effect.\n\n**Valid days**: `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`\n\n**Example:** `saturday, sunday` (no weekends)", - "defaultValue": "\"\"" + "description": "The days of the week that aren't allowed to be selected. Available values: `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`, `sunday`.", + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", "value": "\"single\" | \"range\"", - "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "description": "The type of date selection allowed. Available values: `single`, `range`.", "defaultValue": "\"single\"" }, { @@ -4066,7 +4518,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initially selected date(s) when the component first renders. An empty string means no date is initially selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The initial selected date or date range when the picker first renders, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -4074,14 +4526,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "The name of the picker, used when submitting form data." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "SetAccessor", "name": "value", "value": "string", - "description": "The currently selected date(s). An empty string means no date is selected.\n\n- Single date in `YYYY-MM-DD` format when `type` is set to `\"single\"`\n- Date range in `YYYY-MM-DD--YYYY-MM-DD` format (inclusive) when `type` is set to `\"range\"`", + "description": "The currently selected date or date range, formatted as an ISO 8601 date string.", "defaultValue": "\"\"" }, { @@ -4095,19 +4547,26 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@dirtyStateSymbol@7003", - "value": "boolean", + "name": "__@internals$1@2531", + "value": "ElementInternals", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$1@7002", - "value": "ElementInternals", + "name": "__@dirtyStateSymbol@2532", + "value": "boolean", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -4153,7 +4612,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -4161,19 +4620,33 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DatePicker extends BaseClass$1 implements DatePickerProps {\n accessor defaultView: string;\n set view(view: string);\n get view(): string;\n accessor allow: DatePickerProps['allow'];\n accessor disallow: DatePickerProps['disallow'];\n accessor allowDays: DatePickerProps['allowDays'];\n accessor disallowDays: DatePickerProps['disallowDays'];\n accessor type: DatePickerProps['type'];\n accessor defaultValue: DatePickerProps['defaultValue'];\n accessor name: DatePickerProps['name'];\n set value(value: string);\n get value(): string;\n /** @private */\n [dirtyStateSymbol]: boolean;\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DatePicker\n extends DatePickerBase\n implements DatePickerProps\n{\n constructor();\n}" } }, "DropZone": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "DropZone", - "description": "Configure the following properties on the drop zone component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -4195,29 +4668,29 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -4233,14 +4706,14 @@ "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -4270,7 +4743,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@setFiles@7038", + "name": "__@setFiles@2568", "value": "(files: File[]) => void", "description": "", "isPrivate": true @@ -4278,7 +4751,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", - "name": "__@getFileInput@7040", + "name": "__@getFileInput@2570", "value": "() => HTMLInputElement", "description": "", "isPrivate": true @@ -4286,11 +4759,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals@7039", + "name": "__@internals@2569", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -4336,7 +4816,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -4344,19 +4824,33 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class DropZone extends BaseClass implements DropZoneProps {\n accessor accept: DropZoneProps['accept'];\n accessor accessibilityLabel: DropZoneProps['accessibilityLabel'];\n accessor disabled: DropZoneProps['disabled'];\n accessor error: DropZoneProps['error'];\n accessor label: DropZoneProps['label'];\n accessor labelAccessibilityVisibility: DropZoneProps['labelAccessibilityVisibility'];\n accessor multiple: DropZoneProps['multiple'];\n accessor name: DropZoneProps['name'];\n accessor required: DropZoneProps['required'];\n get value(): string;\n /** This sets the input value for a file type, which cannot be set programatically, so it can only be reset. */\n set value(value: '' | null);\n get files(): File[];\n set files(files: File[]);\n /** @private */\n [setFiles](files: File[]): void;\n /** @private */\n [getFileInput](): ReplaceType<\n Element | null | undefined,\n Element,\n HTMLInputElement\n >;\n\n /** @private */\n formResetCallback(): void;\n constructor();\n}" + "value": "declare class DropZone extends DropZoneBase implements DropZoneProps {\n constructor();\n}" } }, "Divider": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Divider", - "description": "Configure the following properties on the divider component.", - "isPublicDocs": true, + "description": "A divider is a visual separator that creates a line between different sections of content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -4374,6 +4868,13 @@ "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -4419,7 +4920,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -4427,34 +4928,48 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Divider extends PreactCustomElement implements DividerProps {\n accessor direction: DividerProps['direction'];\n accessor color: DividerProps['color'];\n constructor();\n}" + "value": "declare class Divider extends PolarisCustomElement implements DividerProps {\n /**\n * The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n *\n * - `inline`: Horizontal divider for separating vertically stacked content\n * - `block`: Vertical divider for separating horizontally arranged content\n *\n * @default 'inline'\n */\n direction: DividerProps['direction'];\n /**\n * The visual prominence of the divider line.\n *\n * - `base`: Standard divider for most separations (default)\n * - `strong`: More prominent divider for major section breaks\n *\n * @default 'base'\n */\n color: DividerProps['color'];\n constructor();\n}" } }, "EmailField": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "EmailField", - "description": "Configure the following properties on the email field component.", - "isPublicDocs": true, + "description": "The email field custom element class that renders an email input field in the Shopify admin interface. This component allows merchants to enter email addresses with automatic validation and optimized mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | EmailAutocompleteField | `section-${string} email` | `section-${string} home email` | `section-${string} mobile email` | `section-${string} fax email` | `section-${string} pager email` | \"shipping email\" | \"shipping home email\" | \"shipping mobile email\" | \"shipping fax email\" | \"shipping pager email\" | \"billing email\" | \"billing home email\" | \"billing mobile email\" | \"billing fax email\" | \"billing pager email\" | `section-${string} shipping email` | `section-${string} shipping home email` | `section-${string} shipping mobile email` | `section-${string} shipping fax email` | `section-${string} shipping pager email` | `section-${string} billing email` | `section-${string} billing home email` | `section-${string} billing mobile email` | `section-${string} billing fax email` | `section-${string} billing pager email`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint as to the intended content of the field for autocomplete purposes.", + "defaultValue": "'email'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -4462,50 +4977,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -4513,14 +5021,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -4528,7 +5036,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -4552,7 +5060,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -4576,7 +5084,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -4584,23 +5092,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@6805", + "name": "__@internals$4@2293", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -4638,7 +5160,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -4646,11 +5168,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class EmailField\n extends PreactFieldElement\n implements EmailFieldProps\n{\n accessor autocomplete: EmailFieldProps['autocomplete'];\n accessor maxLength: EmailFieldProps['maxLength'];\n accessor minLength: EmailFieldProps['minLength'];\n /**\n * The current email address value in the field. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as an email address format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class EmailField extends EmailFieldBase implements EmailFieldProps {\n constructor();\n}" } }, "EmailAutocompleteField": { @@ -4659,23 +5196,21 @@ "syntaxKind": "TypeAliasDeclaration", "name": "EmailAutocompleteField", "value": "'email' | 'home email' | 'mobile email' | 'fax email' | 'pager email'", - "description": "Represents autocomplete values that are valid for email input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for email inputs.\n\nAvailable values:\n- `email` - Primary email address\n- `home email` - Home email address\n- `mobile email` - Mobile device email address\n- `fax email` - Fax machine email address\n- `pager email` - Pager device email address", - "isPublicDocs": true + "description": "" } }, "Grid": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Grid", - "description": "Configure the following properties on the grid component.", - "isPublicDocs": true, + "description": "A grid is a layout component that arranges its children in rows and columns with precise control over sizing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridTemplateColumns", "value": "string", - "description": "The columns in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid columns.", "defaultValue": "'none'" }, { @@ -4683,7 +5218,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridTemplateRows", "value": "string", - "description": "The rows in the grid and their sizes.\n\nAccepts:\n- [Track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes), such as `1fr auto`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported track sizing values as a query value", + "description": "The template that defines the grid rows.", "defaultValue": "'none'" }, { @@ -4691,7 +5226,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyItems", "value": "\"\" | JustifyItemsKeyword", - "description": "Aligns the grid items along the inline axis.", + "description": "The alignment of grid items along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -4699,7 +5234,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "\"\" | AlignItemsKeyword", - "description": "Aligns the grid items along the block axis.", + "description": "The alignment of grid items along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -4707,7 +5242,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeItems", "value": "AlignItemsKeyword | \"normal normal\" | \"normal stretch\" | \"normal baseline\" | \"normal first baseline\" | \"normal last baseline\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch baseline\" | \"stretch first baseline\" | \"stretch last baseline\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline baseline\" | \"baseline first baseline\" | \"baseline last baseline\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline baseline\" | \"first baseline first baseline\" | \"first baseline last baseline\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline baseline\" | \"last baseline first baseline\" | \"last baseline last baseline\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start baseline\" | \"start first baseline\" | \"start last baseline\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end baseline\" | \"end first baseline\" | \"end last baseline\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center baseline\" | \"center first baseline\" | \"center last baseline\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start baseline\" | \"unsafe start first baseline\" | \"unsafe start last baseline\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end baseline\" | \"unsafe end first baseline\" | \"unsafe end last baseline\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center baseline\" | \"unsafe center first baseline\" | \"unsafe center last baseline\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start baseline\" | \"safe start first baseline\" | \"safe start last baseline\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end baseline\" | \"safe end first baseline\" | \"safe end last baseline\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center baseline\" | \"safe center first baseline\" | \"safe center last baseline\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\"", - "description": "A shorthand property for `justify-items` and `align-items`.", + "description": "A shorthand for setting both `alignItems` and `justifyItems`.", "defaultValue": "'normal normal'" }, { @@ -4715,7 +5250,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "\"\" | JustifyContentKeyword", - "description": "Aligns the grid along the inline axis. This overrides the inline value of `placeContent`.", + "description": "The alignment of the grid along the inline axis.", "defaultValue": "'' - meaning no override" }, { @@ -4723,7 +5258,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "\"\" | AlignContentKeyword", - "description": "Aligns the grid along the block axis. This overrides the block value of `placeContent`.", + "description": "The alignment of the grid along the block axis.", "defaultValue": "'' - meaning no override" }, { @@ -4731,7 +5266,7 @@ "syntaxKind": "PropertyDeclaration", "name": "placeContent", "value": "\"normal normal\" | \"normal stretch\" | \"normal start\" | \"normal end\" | \"normal center\" | \"normal unsafe start\" | \"normal unsafe end\" | \"normal unsafe center\" | \"normal safe start\" | \"normal safe end\" | \"normal safe center\" | \"stretch normal\" | \"stretch stretch\" | \"stretch start\" | \"stretch end\" | \"stretch center\" | \"stretch unsafe start\" | \"stretch unsafe end\" | \"stretch unsafe center\" | \"stretch safe start\" | \"stretch safe end\" | \"stretch safe center\" | \"baseline normal\" | \"baseline stretch\" | \"baseline start\" | \"baseline end\" | \"baseline center\" | \"baseline unsafe start\" | \"baseline unsafe end\" | \"baseline unsafe center\" | \"baseline safe start\" | \"baseline safe end\" | \"baseline safe center\" | \"first baseline normal\" | \"first baseline stretch\" | \"first baseline start\" | \"first baseline end\" | \"first baseline center\" | \"first baseline unsafe start\" | \"first baseline unsafe end\" | \"first baseline unsafe center\" | \"first baseline safe start\" | \"first baseline safe end\" | \"first baseline safe center\" | \"last baseline normal\" | \"last baseline stretch\" | \"last baseline start\" | \"last baseline end\" | \"last baseline center\" | \"last baseline unsafe start\" | \"last baseline unsafe end\" | \"last baseline unsafe center\" | \"last baseline safe start\" | \"last baseline safe end\" | \"last baseline safe center\" | \"start normal\" | \"start stretch\" | \"start start\" | \"start end\" | \"start center\" | \"start unsafe start\" | \"start unsafe end\" | \"start unsafe center\" | \"start safe start\" | \"start safe end\" | \"start safe center\" | \"end normal\" | \"end stretch\" | \"end start\" | \"end end\" | \"end center\" | \"end unsafe start\" | \"end unsafe end\" | \"end unsafe center\" | \"end safe start\" | \"end safe end\" | \"end safe center\" | \"center normal\" | \"center stretch\" | \"center start\" | \"center end\" | \"center center\" | \"center unsafe start\" | \"center unsafe end\" | \"center unsafe center\" | \"center safe start\" | \"center safe end\" | \"center safe center\" | \"unsafe start normal\" | \"unsafe start stretch\" | \"unsafe start start\" | \"unsafe start end\" | \"unsafe start center\" | \"unsafe start unsafe start\" | \"unsafe start unsafe end\" | \"unsafe start unsafe center\" | \"unsafe start safe start\" | \"unsafe start safe end\" | \"unsafe start safe center\" | \"unsafe end normal\" | \"unsafe end stretch\" | \"unsafe end start\" | \"unsafe end end\" | \"unsafe end center\" | \"unsafe end unsafe start\" | \"unsafe end unsafe end\" | \"unsafe end unsafe center\" | \"unsafe end safe start\" | \"unsafe end safe end\" | \"unsafe end safe center\" | \"unsafe center normal\" | \"unsafe center stretch\" | \"unsafe center start\" | \"unsafe center end\" | \"unsafe center center\" | \"unsafe center unsafe start\" | \"unsafe center unsafe end\" | \"unsafe center unsafe center\" | \"unsafe center safe start\" | \"unsafe center safe end\" | \"unsafe center safe center\" | \"safe start normal\" | \"safe start stretch\" | \"safe start start\" | \"safe start end\" | \"safe start center\" | \"safe start unsafe start\" | \"safe start unsafe end\" | \"safe start unsafe center\" | \"safe start safe start\" | \"safe start safe end\" | \"safe start safe center\" | \"safe end normal\" | \"safe end stretch\" | \"safe end start\" | \"safe end end\" | \"safe end center\" | \"safe end unsafe start\" | \"safe end unsafe end\" | \"safe end unsafe center\" | \"safe end safe start\" | \"safe end safe end\" | \"safe end safe center\" | \"safe center normal\" | \"safe center stretch\" | \"safe center start\" | \"safe center end\" | \"safe center center\" | \"safe center unsafe start\" | \"safe center unsafe end\" | \"safe center unsafe center\" | \"safe center safe start\" | \"safe center safe end\" | \"safe center safe center\" | AlignContentKeyword | \"normal space-between\" | \"normal space-around\" | \"normal space-evenly\" | \"baseline space-between\" | \"baseline space-around\" | \"baseline space-evenly\" | \"first baseline space-between\" | \"first baseline space-around\" | \"first baseline space-evenly\" | \"last baseline space-between\" | \"last baseline space-around\" | \"last baseline space-evenly\" | \"start space-between\" | \"start space-around\" | \"start space-evenly\" | \"end space-between\" | \"end space-around\" | \"end space-evenly\" | \"center space-between\" | \"center space-around\" | \"center space-evenly\" | \"unsafe start space-between\" | \"unsafe start space-around\" | \"unsafe start space-evenly\" | \"unsafe end space-between\" | \"unsafe end space-around\" | \"unsafe end space-evenly\" | \"unsafe center space-between\" | \"unsafe center space-around\" | \"unsafe center space-evenly\" | \"safe start space-between\" | \"safe start space-around\" | \"safe start space-evenly\" | \"safe end space-between\" | \"safe end space-around\" | \"safe end space-evenly\" | \"safe center space-between\" | \"safe center space-around\" | \"safe center space-evenly\" | \"stretch space-between\" | \"stretch space-around\" | \"stretch space-evenly\" | \"space-between normal\" | \"space-between start\" | \"space-between end\" | \"space-between center\" | \"space-between unsafe start\" | \"space-between unsafe end\" | \"space-between unsafe center\" | \"space-between safe start\" | \"space-between safe end\" | \"space-between safe center\" | \"space-between stretch\" | \"space-between space-between\" | \"space-between space-around\" | \"space-between space-evenly\" | \"space-around normal\" | \"space-around start\" | \"space-around end\" | \"space-around center\" | \"space-around unsafe start\" | \"space-around unsafe end\" | \"space-around unsafe center\" | \"space-around safe start\" | \"space-around safe end\" | \"space-around safe center\" | \"space-around stretch\" | \"space-around space-between\" | \"space-around space-around\" | \"space-around space-evenly\" | \"space-evenly normal\" | \"space-evenly start\" | \"space-evenly end\" | \"space-evenly center\" | \"space-evenly unsafe start\" | \"space-evenly unsafe end\" | \"space-evenly unsafe center\" | \"space-evenly safe start\" | \"space-evenly safe end\" | \"space-evenly safe center\" | \"space-evenly stretch\" | \"space-evenly space-between\" | \"space-evenly space-around\" | \"space-evenly space-evenly\"", - "description": "A shorthand property for `justify-content` and `align-content`.", + "description": "A shorthand for setting both `alignContent` and `justifyContent`.", "defaultValue": "'normal normal'" }, { @@ -4739,7 +5274,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows and columns.", "defaultValue": "'none'" }, { @@ -4747,7 +5282,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "s spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid rows.", "defaultValue": "'' - meaning no override" }, { @@ -4755,7 +5290,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between grid columns.", "defaultValue": "'' - meaning no override" }, { @@ -4763,7 +5298,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -4771,7 +5306,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -4779,7 +5314,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -4787,7 +5322,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -4795,7 +5330,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -4803,7 +5338,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -4811,7 +5346,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -4819,7 +5354,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -4827,7 +5362,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -4835,7 +5370,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -4843,7 +5378,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4851,7 +5386,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4859,7 +5394,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4867,7 +5402,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4875,7 +5410,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4883,7 +5418,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -4891,7 +5426,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -4911,7 +5446,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -4919,7 +5454,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -4927,7 +5462,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -4935,7 +5470,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -4943,14 +5478,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -4958,9 +5493,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -5006,7 +5548,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5014,11 +5556,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n accessor gridTemplateColumns: GridProps['gridTemplateColumns'];\n accessor gridTemplateRows: GridProps['gridTemplateRows'];\n accessor justifyItems: GridProps['justifyItems'];\n accessor alignItems: GridProps['alignItems'];\n accessor placeItems: GridProps['placeItems'];\n accessor justifyContent: GridProps['justifyContent'];\n accessor alignContent: GridProps['alignContent'];\n accessor placeContent: GridProps['placeContent'];\n accessor gap: GridProps['gap'];\n accessor rowGap: GridProps['rowGap'];\n accessor columnGap: GridProps['columnGap'];\n}" + "value": "declare class Grid extends BoxElement implements GridProps {\n constructor();\n /**\n * The template that defines the grid columns.\n */\n gridTemplateColumns: GridProps['gridTemplateColumns'];\n /**\n * The template that defines the grid rows.\n */\n gridTemplateRows: GridProps['gridTemplateRows'];\n /**\n * The alignment of grid items along the inline axis.\n */\n justifyItems: GridProps['justifyItems'];\n /**\n * The alignment of grid items along the block axis.\n */\n alignItems: GridProps['alignItems'];\n /**\n * A shorthand for setting both `alignItems` and `justifyItems`.\n */\n placeItems: GridProps['placeItems'];\n /**\n * The alignment of the grid along the inline axis.\n */\n justifyContent: GridProps['justifyContent'];\n /**\n * The alignment of the grid along the block axis.\n */\n alignContent: GridProps['alignContent'];\n /**\n * A shorthand for setting both `alignContent` and `justifyContent`.\n */\n placeContent: GridProps['placeContent'];\n /**\n * The spacing between grid rows and columns.\n */\n gap: GridProps['gap'];\n /**\n * The spacing between grid rows.\n */\n rowGap: GridProps['rowGap'];\n /**\n * The spacing between grid columns.\n */\n columnGap: GridProps['columnGap'];\n}" } }, "JustifyItemsKeyword": { @@ -5027,8 +5584,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "JustifyItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.\n\nLearn more about the [justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).", - "isPublicDocs": true + "description": "Justify items defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis." } }, "BaselinePosition": { @@ -5037,8 +5593,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "BaselinePosition", "value": "'baseline' | 'first baseline' | 'last baseline'", - "description": "Represents baseline alignment positions used to align items relative to their baselines.\n- `baseline`: Aligns to the baseline of the parent.\n- `first baseline`: Aligns to the first baseline of the parent.\n- `last baseline`: Aligns to the last baseline of the parent.", - "isPublicDocs": true + "description": "" } }, "OverflowPosition": { @@ -5047,8 +5602,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "OverflowPosition", "value": "`unsafe ${ContentPosition}` | `safe ${ContentPosition}`", - "description": "Represents content positioning with overflow behavior control. Use `safe` to prevent content from becoming inaccessible when it overflows, or `unsafe` to allow overflow regardless of accessibility.", - "isPublicDocs": true + "description": "" } }, "ContentPosition": { @@ -5057,8 +5611,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "ContentPosition", "value": "'center' | 'start' | 'end'", - "description": "Defines the position of content along an axis.\n- `center`: Centers the content.\n- `start`: Aligns content to the start.\n- `end`: Aligns content to the end.", - "isPublicDocs": true + "description": "" } }, "AlignItemsKeyword": { @@ -5067,8 +5620,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "AlignItemsKeyword", "value": "'normal' | 'stretch' | BaselinePosition | OverflowPosition | ContentPosition", - "description": "Align items sets the align-self value on all direct children as a group.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isPublicDocs": true + "description": "Align items sets the align-self value on all direct children as a group." } }, "JustifyContentKeyword": { @@ -5077,8 +5629,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "JustifyContentKeyword", "value": "'normal' | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", - "isPublicDocs": true + "description": "Justify content defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container." } }, "ContentDistribution": { @@ -5087,8 +5638,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "ContentDistribution", "value": "'space-between' | 'space-around' | 'space-evenly' | 'stretch'", - "description": "Defines how space is distributed between and around content items in flex and grid layouts.\n- `space-between`: Distributes items evenly with the first item at the start and last at the end.\n- `space-around`: Distributes items evenly with equal space around each item.\n- `space-evenly`: Distributes items evenly with equal space between them.\n- `stretch`: Stretches items to fill the container.", - "isPublicDocs": true + "description": "" } }, "AlignContentKeyword": { @@ -5097,8 +5647,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "AlignContentKeyword", "value": "'normal' | BaselinePosition | ContentDistribution | OverflowPosition | ContentPosition", - "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isPublicDocs": true + "description": "Align content sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis." } }, "SpacingKeyword": { @@ -5107,23 +5656,21 @@ "syntaxKind": "TypeAliasDeclaration", "name": "SpacingKeyword", "value": "SizeKeyword | 'none'", - "description": "Defines the spacing size between elements, using the standard size scale or `none` for no spacing.", - "isPublicDocs": true + "description": "" } }, "GridItem": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "GridItem", - "description": "The grid item component represents a single cell within a grid layout, allowing you to control how content is positioned and sized within the grid. Use grid item as a child of grid to specify column span, row span, and positioning for individual content areas.\n\nGrid item supports precise placement control through column and row properties, enabling you to create complex layouts where different items occupy varying amounts of space or appear in specific grid positions.", - "isPublicDocs": true, + "description": "A grid item is a child of a grid that can be positioned within specific rows and columns.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "gridColumn", "value": "\"auto\" | `span ${number}`", - "description": "The number of columns the item will span across.\n\nLearn more about the [grid-column property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).", + "description": "The column position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -5131,7 +5678,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gridRow", "value": "\"auto\" | `span ${number}`", - "description": "The number of rows the item will span across.\n\nLearn more about the [grid-row property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).", + "description": "The row position and span of the grid item.", "defaultValue": "'auto'" }, { @@ -5139,7 +5686,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -5147,7 +5694,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -5155,7 +5702,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -5163,7 +5710,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -5171,7 +5718,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -5179,7 +5726,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -5187,7 +5734,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -5195,7 +5742,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -5203,7 +5750,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -5211,7 +5758,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -5219,7 +5766,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -5227,7 +5774,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -5235,7 +5782,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -5243,7 +5790,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -5251,7 +5798,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -5259,7 +5806,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -5267,7 +5814,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -5287,7 +5834,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -5295,7 +5842,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -5303,7 +5850,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -5311,7 +5858,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -5319,14 +5866,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -5334,9 +5881,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -5382,7 +5936,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5390,26 +5944,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class GridItem extends BoxElement implements GridItemProps {\n accessor gridColumn: GridItemProps['gridColumn'];\n accessor gridRow: GridItemProps['gridRow'];\n constructor();\n}" + "value": "declare class GridItem extends BoxElement implements GridItemProps {\n /**\n * The column position and span of the grid item.\n */\n gridColumn: GridItemProps['gridColumn'];\n /**\n * The row position and span of the grid item.\n */\n gridRow: GridItemProps['gridRow'];\n constructor();\n}" } }, "Heading": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Heading", - "description": "Configure the following properties on the heading component.", - "isPublicDocs": true, + "description": "A custom element for displaying hierarchical section titles and headings with appropriate semantic meaning and visual styling. Use Heading to structure your content with proper heading levels for both visual hierarchy and accessibility.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"heading\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The ARIA role for the heading. Set to `'heading'` (the default) for standard heading semantics, or `'presentation'` / `'none'` to remove heading semantics for decorative use.", "defaultValue": "'heading'" }, { @@ -5417,7 +5985,7 @@ "syntaxKind": "PropertyDeclaration", "name": "lineClamp", "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", "defaultValue": "Infinity - no truncation is applied" }, { @@ -5425,9 +5993,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -5473,7 +6048,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5481,49 +6056,63 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Heading extends PreactCustomElement implements HeadingProps {\n accessor accessibilityRole: HeadingProps['accessibilityRole'];\n accessor lineClamp: HeadingProps['lineClamp'];\n accessor accessibilityVisibility: HeadingProps['accessibilityVisibility'];\n constructor();\n}" + "value": "declare class Heading extends HeadingBase implements HeadingProps {\n constructor();\n}" } }, "Icon": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Icon", - "description": "Configure the following properties on the icon component.", - "isPublicDocs": true, + "description": "An icon displays a graphical symbol from the icon library.", "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `caution`: Advisory notices that need attention.", + "description": "The color tone of the icon based on its semantic meaning.", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "type", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "The icon to display from the icon library.\n\nSet to a valid icon name to display that icon. To hide the icon completely, use an empty string `''`. To reserve the icon's space without displaying an icon, use `'empty'`." + "value": "\"\" | IconType", + "description": "The type of icon to display." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color emphasis of the icon.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"base\"", - "description": "The size of the icon.\n\n- `small`: Smaller icon suitable for inline use within text or compact UI elements.\n- `base`: Default size that works well for standalone icons and standard use cases.", + "description": "The size of the icon.", "defaultValue": "'base'" }, { @@ -5531,7 +6120,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The element that this icon should show interest for when activated." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -5578,7 +6174,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5586,55 +6182,69 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Icon extends PreactCustomElement implements IconProps {\n accessor color: IconProps['color'];\n accessor tone: IconProps['tone'];\n accessor type: IconProps['type'];\n accessor size: IconProps['size'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Icon extends IconBase implements IconProps {\n /**\n * The color tone of the icon based on its semantic meaning.\n */\n tone: IconProps['tone'];\n /**\n * The type of icon to display.\n */\n type: IconProps['type'];\n constructor();\n}" } }, "Image": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Image", - "description": "Configure the following properties on the image component.", - "isPublicDocs": true, + "description": "An image displays pictures with configurable sizing, loading behavior, and borders.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "srcSet", "value": "string", - "description": "A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n\nLearn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset)." + "description": "A set of source images with different sizes for responsive loading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "sizes", "value": "string", - "description": "A set of media conditions and their corresponding sizes.\n\nLearn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes)." + "description": "The sizes of the image at different viewport widths." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "aspectRatio", "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", - "description": "The aspect ratio of the image.\n\nThe rendering of the image will depend on the `inlineSize` value:\n\n- `inlineSize=\"fill\"`: the aspect ratio will be respected and the image will take the necessary space.\n- `inlineSize=\"auto\"`: the image will not render until it has loaded and the aspect ratio will be ignored.\n\nFor example, if the value is set as `50 / 100`, the getter returns `50 / 100`. If the value is set as `0.5`, the getter returns `0.5 / 1`.\n\nLearn more about the [aspect-ratio property](https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio).", + "description": "The aspect ratio of the image as a width-to-height ratio.", "defaultValue": "'1/1'" }, { @@ -5642,7 +6252,7 @@ "syntaxKind": "PropertyDeclaration", "name": "objectFit", "value": "\"contain\" | \"cover\"", - "description": "The image resizing behavior to fit within its container.\n\n- `contain`: Scales the image to fit within the container while maintaining its aspect ratio. The entire image is visible, but might leave empty space.\n- `cover`: Scales the image to fill the entire container while maintaining its aspect ratio. The image might be cropped to fit.\n\nThe image is always positioned in the center of the container.\n\nLearn more about the [object-fit property](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).", + "description": "How the image should be resized to fit its container.", "defaultValue": "'contain'" }, { @@ -5650,7 +6260,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "\"eager\" | \"lazy\"", - "description": "The loading strategy for the image.\n\n- `eager`: Immediately loads the image, irrespective of its position within the visible viewport.\n- `lazy`: Delays loading the image until it approaches a specified distance from the viewport.\n\nLearn more about the [loading attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading).", + "description": "When the image should be loaded.", "defaultValue": "'eager'" }, { @@ -5658,7 +6268,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "\"none\" | \"presentation\" | \"img\"", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `none`: Completely hides the element and its content from assistive technologies\n- `presentation`: Removes semantic meaning, making the image purely decorative and ignored by screen readers.\n- `img`: Identifies the element as an image that conveys meaningful information to users.", + "description": "The accessibility role for the image.", "defaultValue": "'img'" }, { @@ -5666,7 +6276,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "\"auto\" | \"fill\"", - "description": "The displayed inline width of the image.\n\n- `fill`: the image will takes up 100% of the available inline size.\n- `auto`: the image will be displayed at its natural size.\n\nLearn more about the [width attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#width).", + "description": "The inline size (width in horizontal writing modes) of the image.", "defaultValue": "'fill'" }, { @@ -5674,35 +6284,23 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied around the image using shorthand syntax to specify width, color, and style in a single property.", - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "description": "Whether to show a border around the image.", + "defaultValue": "'none' - equivalent to `none base auto`." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderWidth", - "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderStyle", - "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image.", "defaultValue": "'' - meaning no override" }, { @@ -5710,17 +6308,24 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "The color of the border around the image.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the image's corners using the design system's radius scale.", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image.", "defaultValue": "'none'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -5766,7 +6371,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5774,26 +6379,49 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Image extends PreactCustomElement implements ImageProps {\n accessor src: ImageProps['src'];\n accessor srcSet: ImageProps['srcSet'];\n accessor sizes: ImageProps['sizes'];\n accessor alt: ImageProps['alt'];\n accessor aspectRatio: ImageProps['aspectRatio'];\n accessor objectFit: ImageProps['objectFit'];\n accessor loading: ImageProps['loading'];\n accessor accessibilityRole: ImageProps['accessibilityRole'];\n accessor inlineSize: ImageProps['inlineSize'];\n /**\n * A border applied around the image using shorthand syntax to specify width, color, and style in a single property.\n */\n accessor border: ImageProps['border'];\n /**\n * The thickness of the border around the image. When set, this overrides the width value specified in the `border` property.\n */\n accessor borderWidth: ImageProps['borderWidth'];\n /**\n * The visual style of the border around the image, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.\n */\n accessor borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image using the design system's color scale. When set, this overrides the color value specified in the `border` property.\n */\n accessor borderColor: ImageProps['borderColor'];\n /**\n * The roundedness of the image's corners using the design system's radius scale.\n */\n accessor borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + "value": "declare class Image extends PolarisCustomElement implements ImageProps {\n /**\n * The URL of the image to display.\n */\n src: ImageProps['src'];\n /**\n * A set of source images with different sizes for responsive loading.\n */\n srcSet: ImageProps['srcSet'];\n /**\n * The sizes of the image at different viewport widths.\n */\n sizes: ImageProps['sizes'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ImageProps['alt'];\n /**\n * The aspect ratio of the image as a width-to-height ratio.\n */\n aspectRatio: ImageProps['aspectRatio'];\n /**\n * How the image should be resized to fit its container.\n */\n objectFit: ImageProps['objectFit'];\n /**\n * When the image should be loaded.\n */\n loading: ImageProps['loading'];\n /**\n * The accessibility role for the image.\n */\n accessibilityRole: ImageProps['accessibilityRole'];\n /**\n * The inline size (width in horizontal writing modes) of the image.\n */\n inlineSize: ImageProps['inlineSize'];\n /**\n * Whether to show a border around the image.\n */\n border: ImageProps['border'];\n /**\n * The width of the border around the image.\n */\n borderWidth: ImageProps['borderWidth'];\n /**\n * The style of the border around the image.\n */\n borderStyle: ImageProps['borderStyle'];\n /**\n * The color of the border around the image.\n */\n borderColor: ImageProps['borderColor'];\n /**\n * The radius of the border corners around the image.\n */\n borderRadius: ImageProps['borderRadius'];\n constructor();\n}" + } + }, + "BorderRadiusKeyword": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "BorderRadiusKeyword", + "value": "SizeKeyword | 'max' | 'none'", + "description": "" } }, "Link": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Link", - "description": "Configure the following properties on the link component.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "tone", "value": "\"critical\" | \"auto\" | \"neutral\"", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", "defaultValue": "'auto'" }, { @@ -5801,21 +6429,21 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation." + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "target", "value": "\"auto\" | AnyString | \"_blank\" | \"_self\" | \"_parent\" | \"_top\"", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "defaultValue": "'auto'" }, { @@ -5823,14 +6451,21 @@ "syntaxKind": "PropertyDeclaration", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download)." + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "lang", "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)." + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -5877,7 +6512,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5885,15 +6520,30 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", + "description": "Sets the action the [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.", "defaultValue": "'--auto'" }, { @@ -5901,26 +6551,32 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "description": "Sets the element the [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this clickable is activated." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "Sets the element the [interestFor](https://open-ui.org/components/interest-invokers.explainer/#the-pitch-in-code) should act on when this clickable is activated." } ], - "value": "declare class Link extends Link_base implements LinkProps {\n accessor tone: LinkProps['tone'];\n accessor accessibilityLabel: LinkProps['accessibilityLabel'];\n accessor href: LinkProps['href'];\n accessor target: LinkProps['target'];\n accessor download: LinkProps['download'];\n accessor lang: LinkProps['lang'];\n constructor();\n}" + "value": "declare class Link extends LinkBase implements LinkProps {\n tone: LinkProps['tone'];\n constructor();\n}" } }, "ListItem": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "ListItem", - "description": "The list item component represents a single entry within an ordered list or unordered list. Use list item to structure individual points, steps, or items within a list, with each item automatically receiving appropriate list markers (bullets or numbers) from its parent list.\n\nList item must be used as a direct child of ordered list or unordered list components. Each list item can contain text, inline formatting, or other components to create rich list content.", - "isPublicDocs": true, + "description": "A component that represents a single item within an ordered list or unordered list.\n\nUse list item as a child of ordered list or unordered list to create properly structured and accessible list content.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -5966,7 +6622,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -5974,26 +6630,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class ListItem extends PreactCustomElement implements ListItemProps {\n constructor();\n}" + "value": "declare class ListItem extends PolarisCustomElement implements ListItemProps {\n constructor();\n}" } }, "Menu": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Menu", - "description": "Configure the following properties on the menu component.", - "isPublicDocs": true, + "description": "A component that displays a contextual list of actions or options, which is typically triggered by a button or other activator element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the menu for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", @@ -6014,7 +6684,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@7174", + "name": "__@overlayHidden@2725", "value": "boolean", "description": "", "isPrivate": true @@ -6022,7 +6692,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@7175", + "name": "__@overlayActivator@2726", "value": "HTMLElement", "description": "", "isPrivate": true @@ -6030,11 +6700,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@7176", + "name": "__@overlayHideFrameId@2727", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6064,7 +6741,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6072,26 +6749,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n accessor accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class Menu extends PreactOverlayElement implements MenuProps {\n /**\n * A label that describes the menu for assistive technologies.\n */\n accessibilityLabel: string;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" } }, "MoneyField": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "MoneyField", - "description": "Configure the following properties on the money field component.", - "isPublicDocs": true, + "description": "The money field custom element class that renders a monetary input field in the Shopify admin interface. This component allows merchants to enter currency amounts with automatic formatting, decimal precision, and validation against minimum and maximum values.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum monetary value allowed in the field.", "defaultValue": "Infinity" }, { @@ -6099,9 +6790,17 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum monetary value allowed in the field.", "defaultValue": "-Infinity" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "currencyCode", + "value": "\"auto\" | CurrencyCode", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", @@ -6114,7 +6813,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "string", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -6122,35 +6821,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -6158,14 +6857,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -6173,7 +6872,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -6197,7 +6896,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -6221,7 +6920,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -6229,23 +6928,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@6805", + "name": "__@internals$4@2293", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6283,7 +6989,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6291,19 +6997,42 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class MoneyField\n extends PreactFieldElement\n implements MoneyFieldProps\n{\n accessor max: MoneyFieldProps['max'];\n accessor min: MoneyFieldProps['min'];\n /**\n * The current monetary value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string representing the amount in the store's currency.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class MoneyField extends MoneyFieldBase implements MoneyFieldProps {\n constructor();\n}" + } + }, + "CurrencyCode": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "CurrencyCode", + "value": "'USD' | 'EUR' | 'GBP' | 'CAD' | 'AFN' | 'ALL' | 'DZD' | 'AOA' | 'ARS' | 'AMD' | 'AWG' | 'AUD' | 'BBD' | 'AZN' | 'BDT' | 'BSD' | 'BHD' | 'BIF' | 'BZD' | 'BMD' | 'BTN' | 'BAM' | 'BRL' | 'BOB' | 'BWP' | 'BND' | 'BGN' | 'MMK' | 'KHR' | 'CVE' | 'KYD' | 'XAF' | 'CLP' | 'CNY' | 'COP' | 'KMF' | 'CDF' | 'CRC' | 'HRK' | 'CZK' | 'DKK' | 'DOP' | 'XCD' | 'EGP' | 'ETB' | 'XPF' | 'FJD' | 'GMD' | 'GHS' | 'GTQ' | 'GYD' | 'GEL' | 'HTG' | 'HNL' | 'HKD' | 'HUF' | 'ISK' | 'INR' | 'IDR' | 'ILS' | 'IQD' | 'JMD' | 'JPY' | 'JEP' | 'JOD' | 'KZT' | 'KES' | 'KWD' | 'KGS' | 'LAK' | 'LVL' | 'LBP' | 'LSL' | 'LRD' | 'LTL' | 'MGA' | 'MKD' | 'MOP' | 'MWK' | 'MVR' | 'MXN' | 'MYR' | 'MUR' | 'MDL' | 'MAD' | 'MNT' | 'MZN' | 'NAD' | 'NPR' | 'ANG' | 'NZD' | 'NIO' | 'NGN' | 'NOK' | 'OMR' | 'PAB' | 'PKR' | 'PGK' | 'PYG' | 'PEN' | 'PHP' | 'PLN' | 'QAR' | 'RON' | 'RUB' | 'RWF' | 'WST' | 'SAR' | 'RSD' | 'SCR' | 'SGD' | 'SDG' | 'SYP' | 'ZAR' | 'KRW' | 'SSP' | 'SBD' | 'LKR' | 'SRD' | 'SZL' | 'SEK' | 'CHF' | 'TWD' | 'THB' | 'TZS' | 'TTD' | 'TND' | 'TRY' | 'TMT' | 'UGX' | 'UAH' | 'AED' | 'UYU' | 'UZS' | 'VUV' | 'VND' | 'XOF' | 'YER' | 'ZMW' | 'BYN' | 'BYR' | 'DJF' | 'ERN' | 'FKP' | 'GIP' | 'GNF' | 'IRR' | 'KID' | 'LYD' | 'MRU' | 'SLL' | 'SHP' | 'SOS' | 'STD' | 'STN' | 'TJS' | 'TOP' | 'VED' | 'VEF' | 'VES' | 'XXX'", + "description": "" } }, "NumberField": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "NumberField", - "description": "Configure the following properties on the number field component.", - "isPublicDocs": true, + "description": "The number field custom element class that renders a numeric input field in the Shopify admin interface. This component allows merchants to enter numbers with automatic validation and prefix/suffix display.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -6317,7 +7046,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inputMode", "value": "\"decimal\" | \"numeric\"", - "description": "The type of virtual keyboard to display on mobile devices.\n\n- `decimal`: Shows a numeric keyboard with a decimal point, suitable for prices or measurements.\n- `numeric`: Shows a numeric keyboard without a decimal point, suitable for whole numbers like quantities.\n\nLearn more about the [inputmode attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode).", + "description": "The input mode hint for mobile keyboards. Available values include:\n- `numeric`: Shows a numeric keypad optimized for entering numbers\n- `decimal`: Shows a numeric keypad with decimal point support\n- `tel`: Shows a telephone keypad", "defaultValue": "'decimal'" }, { @@ -6325,7 +7054,7 @@ "syntaxKind": "PropertyDeclaration", "name": "step", "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "description": "The granularity that the value must adhere to, or the keyword `any`. This controls the increment/decrement step size.", "defaultValue": "1" }, { @@ -6333,7 +7062,7 @@ "syntaxKind": "PropertyDeclaration", "name": "max", "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "description": "The maximum numeric value allowed in the field.", "defaultValue": "Infinity" }, { @@ -6341,7 +7070,7 @@ "syntaxKind": "PropertyDeclaration", "name": "min", "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", + "description": "The minimum numeric value allowed in the field.", "defaultValue": "-Infinity" }, { @@ -6349,7 +7078,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the user's input, such as a currency symbol.", "defaultValue": "''" }, { @@ -6357,7 +7086,7 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the user's input, such as a unit of measurement.", "defaultValue": "''" }, { @@ -6365,7 +7094,7 @@ "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | NumberAutocompleteField | `section-${string} one-time-code` | `section-${string} cc-number` | `section-${string} cc-csc` | \"shipping one-time-code\" | \"shipping cc-number\" | \"shipping cc-csc\" | \"billing one-time-code\" | \"billing cc-number\" | \"billing cc-csc\" | `section-${string} shipping one-time-code` | `section-${string} shipping cc-number` | `section-${string} shipping cc-csc` | `section-${string} billing one-time-code` | `section-${string} billing cc-number` | `section-${string} billing cc-csc`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -6373,35 +7102,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -6409,14 +7138,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -6424,7 +7153,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -6448,7 +7177,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -6472,7 +7201,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -6480,23 +7209,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@6805", + "name": "__@internals$4@2293", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6534,7 +7270,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6542,11 +7278,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class NumberField\n extends PreactFieldElement\n implements NumberFieldProps\n{\n /**\n * The current numeric value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value should be a numeric string (decimal or integer).\n */\n get value(): string;\n set value(value: string);\n accessor inputMode: NumberFieldProps['inputMode'];\n accessor step: NumberFieldProps['step'];\n accessor max: NumberFieldProps['max'];\n accessor min: NumberFieldProps['min'];\n accessor prefix: NumberFieldProps['prefix'];\n accessor suffix: NumberFieldProps['suffix'];\n constructor();\n}" + "value": "declare class NumberField extends NumberFieldBase implements NumberFieldProps {\n constructor();\n}" } }, "NumberAutocompleteField": { @@ -6555,23 +7306,21 @@ "syntaxKind": "TypeAliasDeclaration", "name": "NumberAutocompleteField", "value": "'one-time-code' | 'cc-number' | 'cc-csc'", - "description": "Represents autocomplete values that are valid for number input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for numeric inputs.\n\nAvailable values:\n- `one-time-code` - One-time codes for authentication (OTP, 2FA codes)\n- `cc-number` - Credit card number\n- `cc-csc` - Credit card security code (CVV/CVC)", - "isPublicDocs": true + "description": "" } }, "Option": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Option", - "description": "Represents a single option within a select component. Use only as a child of s-select components.", - "isPublicDocs": true, + "description": "A single option within a select dropdown that users can choose.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "selected", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", + "description": "Whether the option is currently selected.", "defaultValue": "false" }, { @@ -6579,7 +7328,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultSelected", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the option should be selected when it's first rendered.", "defaultValue": "false" }, { @@ -6587,16 +7336,23 @@ "syntaxKind": "PropertyDeclaration", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\"." + "description": "The value that's submitted with the form when this option is selected." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the option is disabled and can't be selected.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6642,7 +7398,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6650,26 +7406,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Option extends PreactCustomElement implements OptionProps {\n accessor selected: OptionProps['selected'];\n accessor defaultSelected: OptionProps['defaultSelected'];\n accessor value: OptionProps['value'];\n accessor disabled: OptionProps['disabled'];\n constructor();\n}" + "value": "declare class Option extends PolarisCustomElement implements OptionProps {\n /**\n * Whether the option is currently selected.\n */\n selected: OptionProps['selected'];\n /**\n * Whether the option should be selected when it's first rendered.\n */\n defaultSelected: OptionProps['defaultSelected'];\n /**\n * The value that's submitted with the form when this option is selected.\n */\n value: OptionProps['value'];\n /**\n * Whether the option is disabled and can't be selected.\n */\n disabled: OptionProps['disabled'];\n constructor();\n}" } }, "OptionGroup": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "OptionGroup", - "description": "Represents a group of options within a select component. Use only as a child of `s-select` components.", - "isPublicDocs": true, + "description": "A group of related options within a select dropdown, displayed with a label.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the options within this group can be selected or not.", + "description": "Whether all options in the group are disabled and can't be selected.", "defaultValue": "false" }, { @@ -6677,7 +7447,14 @@ "syntaxKind": "PropertyDeclaration", "name": "label", "value": "string", - "description": "The user-facing label for this group of options." + "description": "The text that describes what this group of options represents." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -6724,7 +7501,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6732,20 +7509,41 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OptionGroup\n extends PreactCustomElement\n implements OptionGroupProps\n{\n accessor disabled: OptionGroupProps['disabled'];\n accessor label: OptionGroupProps['label'];\n constructor();\n}" + "value": "declare class OptionGroup\n extends PolarisCustomElement\n implements OptionGroupProps\n{\n /**\n * Whether all options in the group are disabled and can't be selected.\n */\n disabled: OptionGroupProps['disabled'];\n /**\n * The text that describes what this group of options represents.\n */\n label: OptionGroupProps['label'];\n constructor();\n}" } }, "OrderedList": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "OrderedList", - "description": "Configure the following properties on the ordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a numbered list of items with automatic numbering and proper list semantics. Use ordered list when the sequence or order of items matters, such as instructions, rankings, or step-by-step processes.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6791,7 +7589,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6799,50 +7597,64 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class OrderedList\n extends PreactCustomElement\n implements OrderedListProps\n{\n constructor();\n}" + "value": "declare class OrderedList\n extends PolarisCustomElement\n implements OrderedListProps\n{\n constructor();\n}" } }, "Paragraph": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Paragraph", - "description": "Configure the following properties on the paragraph component.", - "isPublicDocs": true, + "description": "A custom element for displaying blocks of text content with consistent spacing and styling for readable body copy. Use Paragraph to render longer text content with proper line height and spacing between paragraphs.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "lineClamp", - "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", - "defaultValue": "Infinity - no truncation is applied" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the paragraph text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"caution\"", - "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "lineClamp", + "value": "number", + "description": "The maximum number of lines to display before the text is truncated with an ellipsis.", + "defaultValue": "Infinity - no truncation is applied" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "color", "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "description": "The color of the paragraph text.", "defaultValue": "'base'" }, { @@ -6850,7 +7662,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -6858,9 +7670,16 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -6906,7 +7725,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -6914,26 +7733,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Paragraph extends PreactCustomElement implements ParagraphProps {\n accessor fontVariantNumeric: ParagraphProps['fontVariantNumeric'];\n accessor lineClamp: ParagraphProps['lineClamp'];\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: ParagraphProps['tone'];\n\n accessor color: ParagraphProps['color'];\n accessor dir: ParagraphProps['dir'];\n accessor accessibilityVisibility: ParagraphProps['accessibilityVisibility'];\n constructor();\n}" - } - }, - "PasswordField": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "PasswordField", - "description": "Configure the following properties on the password field component.", - "isPublicDocs": true, + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Paragraph extends ParagraphBase implements ParagraphProps {\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: ParagraphProps['tone'];\n constructor();\n}" + } + }, + "PasswordField": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "PasswordField", + "description": "The password field custom element class that renders a password input field in the Shopify admin interface. This component allows merchants to enter passwords securely with characters automatically masked for privacy.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the password.", "defaultValue": "Infinity" }, { @@ -6941,22 +7774,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the password.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | PasswordAutocompleteField | `section-${string} current-password` | `section-${string} new-password` | \"shipping current-password\" | \"shipping new-password\" | \"billing current-password\" | \"billing new-password\" | `section-${string} shipping current-password` | `section-${string} shipping new-password` | `section-${string} billing current-password` | `section-${string} billing new-password`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -6964,35 +7790,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -7000,14 +7826,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -7015,7 +7841,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -7039,7 +7865,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -7063,7 +7889,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -7071,23 +7897,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@6805", + "name": "__@internals$4@2293", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7125,7 +7965,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7133,11 +7973,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class PasswordField\n extends PreactFieldElement\n implements PasswordFieldProps\n{\n accessor maxLength: PasswordFieldProps['maxLength'];\n accessor minLength: PasswordFieldProps['minLength'];\n /**\n * The current password value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The value is masked in the UI for security.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class PasswordField\n extends PasswordFieldBase\n implements PasswordFieldProps\n{\n constructor();\n}" } }, "PasswordAutocompleteField": { @@ -7146,25 +8001,30 @@ "syntaxKind": "TypeAliasDeclaration", "name": "PasswordAutocompleteField", "value": "'current-password' | 'new-password'", - "description": "Represents autocomplete values that are valid for password input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for password inputs.\n\nAvailable values:\n- `current-password` - Existing password for login or authentication\n- `new-password` - New password when creating an account or changing password", - "isPublicDocs": true + "description": "" } }, "QueryContainer": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "QueryContainer", - "description": "Configure the following properties on the query container component.", - "isPublicDocs": true, + "description": "A component that sets up a container query context, which lets child elements style themselves based on the container's size instead of the viewport size.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "containerName", "value": "string", - "description": "An identifier for this container that you can reference in CSS container queries to apply styles based on this specific container's size.\n\nAll query container components automatically receive a container name of `s-default`. You can omit the container name in your queries, so `@container (inline-size <= 300px)` is equivalent to `@container s-default (inline-size <= 300px)`.\n\nWhen you provide a custom `containerName`, it's added alongside `s-default`. For example, `containerName=\"product-card\"` results in `s-default product-card` being set on the `container-name` CSS property, allowing you to target this container with `@container product-card (inline-size <= 300px)`.\n\nLearn more about the [container-name property](https://developer.mozilla.org/en-US/docs/Web/CSS/container-name).", + "description": "The name of the container, which you can reference in CSS container queries.", "defaultValue": "''" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7210,7 +8070,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7218,26 +8078,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class QueryContainer\n extends PreactCustomElement\n implements QueryContainerProps\n{\n accessor containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" + "value": "declare class QueryContainer\n extends PolarisCustomElement\n implements QueryContainerProps\n{\n /**\n * The name of the container, which you can reference in CSS container queries.\n */\n containerName: QueryContainerProps['containerName'];\n /** @private */\n static globalStylesApplied: boolean;\n constructor();\n}" } }, "SearchField": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "SearchField", - "description": "Configure the following properties on the search field component.", - "isPublicDocs": true, + "description": "A search field that lets users enter search queries with a search-specific input type.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters that can be entered in the field.", "defaultValue": "Infinity" }, { @@ -7245,22 +8119,15 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters that must be entered for the field to be valid.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -7268,35 +8135,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -7304,14 +8171,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -7319,7 +8186,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -7343,7 +8210,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -7367,7 +8234,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -7375,23 +8242,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@6805", + "name": "__@internals$4@2293", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7429,7 +8310,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7437,11 +8318,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class SearchField\n extends PreactFieldElement\n implements SearchFieldProps\n{\n accessor maxLength: SearchFieldProps['maxLength'];\n accessor minLength: SearchFieldProps['minLength'];\n /**\n * The current search query value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class SearchField extends SearchFieldBase implements SearchFieldProps {\n constructor();\n}" } }, "TextAutocompleteField": { @@ -7449,17 +8345,15 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "TextAutocompleteField", - "value": "'language' | 'organization' | 'name' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", - "description": "Represents autocomplete values that are valid for text input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for text-based inputs.\n\nAvailable values:\n- `name` - Full name\n- `given-name` - First name\n- `additional-name` - Middle name\n- `family-name` - Last name\n- `nickname` - Nickname or handle\n- `username` - Username for login\n- `honorific-prefix` - Name prefix (Mr., Mrs., Dr.)\n- `honorific-suffix` - Name suffix (Jr., Sr., III)\n- `organization` - Company or organization name\n- `organization-title` - Job title or position\n- `address-line1` - Street address (first line)\n- `address-line2` - Street address (second line)\n- `address-line3` - Street address (third line)\n- `address-level1` - State or province\n- `address-level2` - City or town\n- `address-level3` - District or locality\n- `address-level4` - Neighborhood or suburb\n- `street-address` - Complete street address (multi-line)\n- `postal-code` - Postal or ZIP code\n- `country` - Country code (US, CA, GB)\n- `country-name` - Country name (United States, Canada)\n- `language` - Preferred language\n- `sex` - Gender or sex\n- `one-time-code` - One-time codes for authentication\n- `transaction-currency` - Currency code (USD, EUR, GBP)\n- `cc-name` - Name on credit card\n- `cc-given-name` - First name on credit card\n- `cc-additional-name` - Middle name on credit card\n- `cc-family-name` - Last name on credit card\n- `cc-type` - Credit card type (Visa, Mastercard)", - "isPublicDocs": true + "value": "'language' | 'organization' | 'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'name' | 'nickname' | 'one-time-code' | 'organization-title' | 'postal-code' | 'sex' | 'street-address' | 'transaction-currency' | 'username' | 'cc-additional-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-type'", + "description": "" } }, "Section": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Section", - "description": "Configure the following properties on the section component.", - "isPublicDocs": true, + "description": "A section is a container that groups related content together with an optional heading.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -7469,28 +8363,43 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "disconnectedCallback", + "value": "() => void", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "The accessibility label for screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The heading text displayed at the top of the section. This heading provides a title for the section's content and automatically uses the appropriate semantic heading level (h2, h3, h4) based on nesting depth to maintain proper document structure." + "description": "The heading text for the section." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "\"base\" | \"none\"", - "description": "The padding applied to all edges of the element.\n\n- `base`: applies padding that is appropriate for the element. Note that it might result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the section need to span to the edge of the section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "description": "Whether the section has padding.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7507,14 +8416,6 @@ "description": "", "isPrivate": true }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7528,7 +8429,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7536,61 +8437,75 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Section extends PreactCustomElement implements SectionProps {\n constructor();\n /** @private */\n connectedCallback(): void;\n accessor accessibilityLabel: SectionProps['accessibilityLabel'];\n accessor heading: SectionProps['heading'];\n accessor padding: SectionProps['padding'];\n}" + "value": "declare class Section extends SectionBase implements SectionProps {\n constructor();\n}" } }, "Select": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Select", - "description": "Configure the following properties on the select component.", - "isPublicDocs": true, + "description": "A select dropdown that lets users choose one option from a list.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"\" | \"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\"", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier." + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the select." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "An error message that's displayed below the select when validation fails." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "The text that describes what the select is for." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "Text that appears in the select when no option is selected to provide a hint about what to choose." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether an option must be selected before the form can be submitted.", "defaultValue": "false" }, { @@ -7598,7 +8513,7 @@ "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, { @@ -7622,7 +8537,7 @@ "syntaxKind": "GetAccessor", "name": "value", "value": "string", - "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component." + "description": "The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected Option component." }, { "filePath": "src/surfaces/admin/components.ts", @@ -7635,15 +8550,15 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@usedFirstOptionSymbol@7453", + "name": "__@usedFirstOptionSymbol@3070", "value": "boolean", - "description": "A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n\nThis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.", + "description": "used to determine if no value or defaultValue was set, in which case the first non-disabled option was used\n\nthis is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@hasInitialValueSymbol@7454", + "name": "__@hasInitialValueSymbol@3071", "value": "boolean", "description": "", "isPrivate": true @@ -7653,7 +8568,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -7661,23 +8576,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@6805", + "name": "__@internals$4@2293", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7707,7 +8629,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7715,35 +8637,56 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Select extends PreactInputElement implements SelectProps {\n accessor icon: SelectProps['icon'];\n accessor details: SelectProps['details'];\n accessor error: SelectProps['error'];\n accessor label: SelectProps['label'];\n accessor placeholder: SelectProps['placeholder'];\n accessor required: SelectProps['required'];\n accessor labelAccessibilityVisibility: SelectProps['labelAccessibilityVisibility'];\n /** @private */\n connectedCallback(): void;\n /**\n * A lifecycle callback that fires when the component is removed from the DOM. Performs cleanup operations.\n * @private\n */\n disconnectedCallback(): void;\n constructor();\n /**\n * A flag used to determine if no value or defaultValue was set, in which case the first non-disabled option was used.\n *\n * This is important because we need to use the placeholder in these situations, even though the first value will be submitted as part of the form.\n * @private\n */\n [usedFirstOptionSymbol]: boolean;\n /**\n * @private\n */\n [hasInitialValueSymbol]: boolean;\n /**\n * The value of the currently selected option. When setting this property programmatically, it updates which option appears selected in the dropdown. When reading it, you get the `value` attribute of the currently selected option component.\n */\n get value(): string;\n set value(value: string);\n /** @private */\n formResetCallback(): void;\n}" + "value": "declare class Select extends SelectBase implements SelectProps {\n constructor();\n}" } }, "Spinner": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Spinner", - "description": "Configure the following properties on the spinner component.", - "isPublicDocs": true, + "description": "A component that displays an animated loading indicator to show that content is currently being processed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the spinner for assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"base\" | \"large\" | \"large-100\"", - "description": "The size of the loading spinner.\n\n- `base`: Default size suitable for inline loading indicators or standard UI contexts.\n- `large`: Larger spinner for more prominent loading states.\n- `large-100`: Extra large spinner for full-page or emphasized loading states.", + "description": "The size of the spinner.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -7789,7 +8732,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -7797,26 +8740,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Spinner extends PreactCustomElement implements SpinnerProps {\n accessor accessibilityLabel: string;\n accessor size: SpinnerProps['size'];\n constructor();\n}" + "value": "declare class Spinner extends PolarisCustomElement implements SpinnerProps {\n /**\n * A label that describes the spinner for assistive technologies.\n */\n accessibilityLabel: string;\n /**\n * The size of the spinner.\n */\n size: SpinnerProps['size'];\n constructor();\n}" } }, "Stack": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Stack", - "description": "Configure the following properties on the stack component.", - "isPublicDocs": true, + "description": "A stack is a layout component that arranges its children in a single direction with controlled spacing and alignment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "direction", "value": "MaybeResponsive<\"inline\" | \"block\">", - "description": "The direction in which the stack's children are placed within the stack.\n\nAccepts:\n- A single value, either `inline` or `block`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported direction values as a query value", + "description": "The direction in which the stack's children are arranged.", "defaultValue": "'block'" }, { @@ -7824,7 +8781,7 @@ "syntaxKind": "PropertyDeclaration", "name": "justifyContent", "value": "JustifyContentKeyword", - "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -7832,7 +8789,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignItems", "value": "AlignItemsKeyword", - "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).", "defaultValue": "'normal'" }, { @@ -7840,7 +8797,7 @@ "syntaxKind": "PropertyDeclaration", "name": "alignContent", "value": "AlignContentKeyword", - "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.", "defaultValue": "'normal'" }, { @@ -7848,7 +8805,7 @@ "syntaxKind": "PropertyDeclaration", "name": "gap", "value": "MaybeResponsive>", - "description": "Adjusts spacing between elements.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value applied to both axes, such as `large-100`\n- A pair of values, such as `large-100 large-500`, to set the inline and block axes respectively\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between the stack's children.", "defaultValue": "'none'" }, { @@ -7856,7 +8813,7 @@ "syntaxKind": "PropertyDeclaration", "name": "rowGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the block axis. This overrides the row value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between rows in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -7864,7 +8821,7 @@ "syntaxKind": "PropertyDeclaration", "name": "columnGap", "value": "MaybeResponsive<\"\" | SpacingKeyword>", - "description": "Adjusts spacing between elements in the inline axis. This overrides the column value of `gap`.\n\nAccepts:\n- A single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value, such as `large-100`\n- A [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported SpacingKeyword as a query value", + "description": "The spacing between columns in the stack.", "defaultValue": "'' - meaning no override" }, { @@ -7872,7 +8829,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "defaultValue": "'generic'" }, { @@ -7880,7 +8837,7 @@ "syntaxKind": "PropertyDeclaration", "name": "background", "value": "BackgroundColorKeyword", - "description": "The background color of the component.", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { @@ -7888,7 +8845,7 @@ "syntaxKind": "PropertyDeclaration", "name": "blockSize", "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -7896,7 +8853,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minBlockSize", "value": "SizeUnits", - "description": "The minimum height in horizontal writing modes, or minimum width in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -7904,7 +8861,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxBlockSize", "value": "SizeUnitsOrNone", - "description": "The maximum height in horizontal writing modes, or maximum width in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -7912,7 +8869,7 @@ "syntaxKind": "PropertyDeclaration", "name": "inlineSize", "value": "SizeUnitsOrAuto", - "description": "The width in horizontal writing modes, or height in vertical writing modes. Use this for flow-relative sizing that adapts to text direction. Learn more about [inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { @@ -7920,7 +8877,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minInlineSize", "value": "SizeUnits", - "description": "The minimum width in horizontal writing modes, or minimum height in vertical writing modes. Prevents the element from shrinking below this size.\n\nLearn more about [min-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -7928,7 +8885,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxInlineSize", "value": "SizeUnitsOrNone", - "description": "The maximum width in horizontal writing modes, or maximum height in vertical writing modes. Prevents the element from growing beyond this size.\n\nLearn more about [max-inline-size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { @@ -7936,7 +8893,7 @@ "syntaxKind": "PropertyDeclaration", "name": "overflow", "value": "\"visible\" | \"hidden\"", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "defaultValue": "'visible'" }, { @@ -7944,7 +8901,7 @@ "syntaxKind": "PropertyDeclaration", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { @@ -7952,7 +8909,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlock", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -7960,7 +8917,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -7968,7 +8925,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingBlockEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -7976,7 +8933,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInline", "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -7984,7 +8941,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineStart", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -7992,7 +8949,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paddingInlineEnd", "value": "MaybeResponsive<\"\" | PaddingKeyword>", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`. Also accepts a [responsive value](/docs/api/polaris/using-web-components#responsive-values) string with the supported `PaddingKeyword` as a query value.", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { @@ -8000,7 +8957,7 @@ "syntaxKind": "PropertyDeclaration", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ { @@ -8020,7 +8977,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderWidth", "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -8028,7 +8985,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderStyle", "value": "\"\" | MaybeAllValuesShorthandProperty", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted. When set, this overrides the style value specified in the `border` property.", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { @@ -8036,7 +8993,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderColor", "value": "\"\" | ColorKeyword", - "description": "The color of the border using the design system's color scale. When set, this overrides the color value specified in the `border` property.", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { @@ -8044,7 +9001,7 @@ "syntaxKind": "PropertyDeclaration", "name": "borderRadius", "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { @@ -8052,14 +9009,14 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -8067,9 +9024,16 @@ "syntaxKind": "PropertyDeclaration", "name": "display", "value": "MaybeResponsive<\"auto\" | \"none\">", - "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component. The outer type sets a component's participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto` the component's initial value. The actual value depends on the component and context.\n- `none` hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8115,7 +9079,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8123,34 +9087,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n accessor direction: StackProps['direction'];\n accessor justifyContent: StackProps['justifyContent'];\n accessor alignItems: StackProps['alignItems'];\n accessor alignContent: StackProps['alignContent'];\n accessor gap: StackProps['gap'];\n accessor rowGap: StackProps['rowGap'];\n accessor columnGap: StackProps['columnGap'];\n}" + "value": "declare class Stack extends BoxElement implements StackProps {\n constructor();\n /**\n * The direction in which the stack's children are arranged.\n */\n direction: StackProps['direction'];\n /**\n * Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n */\n justifyContent: StackProps['justifyContent'];\n /**\n * Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n */\n alignItems: StackProps['alignItems'];\n /**\n * Controls the distribution of lines along the block axis when content wraps into multiple lines.\n */\n alignContent: StackProps['alignContent'];\n /**\n * The spacing between the stack's children.\n */\n gap: StackProps['gap'];\n /**\n * The spacing between rows in the stack.\n */\n rowGap: StackProps['rowGap'];\n /**\n * The spacing between columns in the stack.\n */\n columnGap: StackProps['columnGap'];\n}" } }, "Switch": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Switch", - "description": "Configure the following properties on the switch component.", - "isPublicDocs": true, + "description": "A switch that lets users toggle a setting on or off with a sliding control.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Controls whether the label is visible to all users or only to screen readers.", "defaultValue": "'visible'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "onblur", + "value": "EventListener & ((event: CallbackEvent<\"input\">) => void)", + "description": "" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", "name": "checked", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Whether the control is active.", "defaultValue": "false" }, { @@ -8165,7 +9150,7 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultChecked", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", + "description": "Whether the control is active by default.", "defaultValue": "false" }, { @@ -8173,28 +9158,28 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose." + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state." + "value": "any", + "description": "Visual content to use as the control label." }, { "filePath": "src/surfaces/admin/components.ts", @@ -8217,7 +9202,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -8225,23 +9210,30 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@6805", + "name": "__@internals$4@2293", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8287,7 +9279,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8295,26 +9287,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Switch extends PreactCheckboxElement implements SwitchProps {\n accessor labelAccessibilityVisibility: SwitchProps['labelAccessibilityVisibility'];\n constructor();\n}" + "value": "declare class Switch extends SwitchBase implements SwitchProps {\n constructor();\n}" } }, "Table": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Table", - "description": "Configure the following properties on the table component.", - "isPublicDocs": true, + "description": "A component that displays data in a structured table format that automatically adapts to the available space.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "variant", "value": "\"auto\" | \"list\"", - "description": "The layout variant of the table component.\n\n- `list`: Always displays as a list layout.\n- `table`: Always displays as a traditional table layout.\n- `auto`: Automatically displays as a table on wide screens and as a list on narrow screens.", + "description": "The display variant of the table.", "defaultValue": "'auto'" }, { @@ -8322,7 +9328,7 @@ "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table. When `true`, the table might be in an inert state that prevents user interaction.", + "description": "Whether the table is currently in a loading state.", "defaultValue": "false" }, { @@ -8330,7 +9336,7 @@ "syntaxKind": "PropertyDeclaration", "name": "paginate", "value": "boolean", - "description": "Whether to use pagination controls.", + "description": "Whether the pagination controls are displayed.", "defaultValue": "false" }, { @@ -8338,7 +9344,7 @@ "syntaxKind": "PropertyDeclaration", "name": "hasPreviousPage", "value": "boolean", - "description": "Whether there's a previous page of data.", + "description": "Whether there's a previous page of data that the user can navigate to.", "defaultValue": "false" }, { @@ -8346,25 +9352,40 @@ "syntaxKind": "PropertyDeclaration", "name": "hasNextPage", "value": "boolean", - "description": "Whether there's an additional page of data.", + "description": "Whether there's a next page of data that the user can navigate to.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@actualTableVariantSymbol@7529", - "value": "AddedContext", + "name": "__@elementInternals@3152", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@actualTableVariantSymbol@3150", + "value": "_shopify_admin_web_component_foundations.AddedContext", "description": "", "isPrivate": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@tableHeadersSharedDataSymbol@7530", - "value": "AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", + "name": "__@tableHeadersSharedDataSymbol@3151", + "value": "_shopify_admin_web_component_foundations.AddedContext<{ listSlot: ListSlotType; textContent: string; format: HeaderFormat; }[]>", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8410,7 +9431,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8418,59 +9439,35 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Table extends PreactCustomElement implements TableProps {\n accessor variant: TableProps['variant'];\n accessor loading: TableProps['loading'];\n accessor paginate: TableProps['paginate'];\n accessor hasPreviousPage: TableProps['hasPreviousPage'];\n accessor hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" + "value": "declare class Table extends PolarisCustomElement implements TableProps {\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The display variant of the table.\n */\n variant: TableProps['variant'];\n /**\n * Whether the table is currently in a loading state.\n */\n loading: TableProps['loading'];\n /**\n * Whether the pagination controls are displayed.\n */\n paginate: TableProps['paginate'];\n /**\n * Whether there's a previous page of data that the user can navigate to.\n */\n hasPreviousPage: TableProps['hasPreviousPage'];\n /**\n * Whether there's a next page of data that the user can navigate to.\n */\n hasNextPage: TableProps['hasNextPage'];\n /**\n * @private\n * The actual table variant, which is either 'table' or 'list'.\n */\n [actualTableVariantSymbol]: _shopify_admin_web_component_foundations.AddedContext;\n /** @private */\n [tableHeadersSharedDataSymbol]: _shopify_admin_web_component_foundations.AddedContext<\n {\n listSlot: TableHeaderProps['listSlot'];\n textContent: string;\n format: HeaderFormat;\n }[]\n >;\n\n constructor();\n}" } }, - "AddedContext": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AddedContext", - "description": "", - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "T", - "description": "The current context value.\n\nThe new context value to set, which will notify all consumers." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "addEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => void", - "description": "The **`addEventListener()`** method of the EventTarget interface sets up a function that will be called whenever the specified event is delivered to the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener)" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "dispatchEvent", - "value": "(event: Event) => boolean", - "description": "The **`dispatchEvent()`** method of the EventTarget sends an Event to the object, (synchronously) invoking the affected event listeners in the appropriate order.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/dispatchEvent)" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "removeEventListener", - "value": "(type: string, callback: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions) => void", - "description": "The **`removeEventListener()`** method of the EventTarget interface removes an event listener previously registered with EventTarget.addEventListener() from the target.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/EventTarget/removeEventListener)" - } - ], - "value": "declare class AddedContext extends EventTarget {\n constructor(defaultValue: T);\n /**\n * The current context value.\n */\n get value(): T;\n /**\n * The new context value to set, which will notify all consumers.\n */\n set value(value: T);\n}" - } - }, - "ActualTableVariant": { + "ActualTableVariant": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", "name": "ActualTableVariant", "value": "'table' | 'list'", - "description": "Represents the actual rendered variant of a table component.\n- `table`: Displays as a traditional table layout.\n- `list`: Displays as a list layout.", - "isPublicDocs": true + "description": "" } }, "ListSlotType": { @@ -8479,8 +9476,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "ListSlotType", "value": "'primary' | 'secondary' | 'kicker' | 'inline' | 'labeled'", - "description": "Represents the semantic type of content slots within list items.\n\n- `primary`: The main content or title of the list item.\n- `secondary`: Supporting or descriptive content below the primary content.\n- `kicker`: A small label or tag displayed above the primary content.\n- `inline`: Content displayed inline with the primary content.\n- `labeled`: Content with an associated label.", - "isPublicDocs": true + "description": "" } }, "HeaderFormat": { @@ -8489,7 +9485,7 @@ "syntaxKind": "TypeAliasDeclaration", "name": "HeaderFormat", "value": "'base' | 'numeric' | 'currency'", - "description": "Represents the format options for table headers that control styling and alignment of column content.\n\nAvailable values:\n- `base`: Standard format for text columns\n- `currency`: Right-aligned format for monetary values\n- `numeric`: Right-aligned format for numeric values", + "description": "The format type for a table header, which determines how the cell content is displayed.", "isPublicDocs": true } }, @@ -8497,9 +9493,23 @@ "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "TableBody", - "description": "The table body component represents the main content area of a table, containing the data rows. Use table body as a child of table to structure your table data, with each table row within the body representing a single record or entry.\n\nTable body must contain table row components, which in turn contain table cell components for the actual data values.", - "isPublicDocs": true, + "description": "A component that wraps the body content of a table, which contains the data rows.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@3152", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8545,7 +9555,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8553,28 +9563,57 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableBody extends PreactCustomElement implements TableBodyProps {\n constructor();\n}" + "value": "declare class TableBody extends PolarisCustomElement implements TableBodyProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n}" } }, "TableCell": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "TableCell", - "description": "The table cell component represents a single data cell within a table row. Use table cell as a child of table row to display individual data values, with each cell corresponding to a column in the table.\n\nTable cell automatically inherits styling and alignment from its parent table structure and supports text content or other inline components.", - "isPublicDocs": true, + "description": "A component that represents a single cell in a table row, which displays data in a format that's determined by its column header.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@3152", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "GetAccessor", - "name": "__@headerFormatSymbol@7552", + "name": "__@headerFormatSymbol@3178", "value": "HeaderFormat", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8620,7 +9659,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8628,26 +9667,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableCell extends PreactCustomElement implements TableCellProps {\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" + "value": "declare class TableCell extends PolarisCustomElement implements TableCellProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n get [headerFormatSymbol](): HeaderFormat;\n /** @private */\n set [headerFormatSymbol](format: HeaderFormat);\n}" } }, "TableHeader": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeader", - "description": "The table header component represents a single column header within a table header row. Use table header as a child of table header row to define column headings and optionally enable column sorting.\n\nTable header provides semantic meaning for screen readers and can include sorting controls when configured. Each header corresponds to a column in the table body.", - "isPublicDocs": true, + "description": "A component that defines a column header in a table, which specifies both the header label and how the column's data should be formatted.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "listSlot", "value": "ListSlotType", - "description": "The content designation for this column when the table displays in list variant on mobile devices.", + "description": "The slot where this header's data appears when the table is shown in list view.", "defaultValue": "'labeled'" }, { @@ -8655,7 +9708,22 @@ "syntaxKind": "PropertyDeclaration", "name": "format", "value": "HeaderFormat", - "description": "The format of the column that controls styling and alignment of cell content." + "description": "The format of the header and its corresponding cells." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@3152", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -8702,7 +9770,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8710,19 +9778,33 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeader\n extends PreactCustomElement\n implements TableHeaderProps\n{\n accessor listSlot: TableHeaderProps['listSlot'];\n accessor format: TableHeaderProps['format'];\n constructor();\n}" + "value": "declare class TableHeader\n extends PolarisCustomElement\n implements TableHeaderProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n /**\n * The slot where this header's data appears when the table is shown in list view.\n */\n listSlot: TableHeaderProps['listSlot'];\n /**\n * The format of the header and its corresponding cells.\n */\n format: TableHeaderProps['format'];\n constructor();\n}" } }, "TableHeaderRow": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "TableHeaderRow", - "description": "The table header row component represents the header row of a table, containing column headings. Use table header row as the first child of table (before table body) to define the table structure and provide column labels.\n\nTable header row must contain table header components for each column. These headers provide context for the data columns and can support sorting functionality.", - "isPublicDocs": true, + "description": "A component that wraps the header row of a table, which contains the table header components that define the column structure.", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -8740,6 +9822,21 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@3152", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -8769,7 +9866,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8777,26 +9874,55 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableHeaderRow\n extends PreactCustomElement\n implements TableHeaderRowProps\n{\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" + "value": "declare class TableHeaderRow\n extends PolarisCustomElement\n implements TableHeaderRowProps\n{\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" } }, "TableRow": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "TableRow", - "description": "The table row component represents a single row of data within a table body. Use table row as a child of table body to structure individual records or entries in the table.\n\nTable row must contain table cell components, with each cell representing a data value for the corresponding column. The number of cells should match the number of headers in the table.", - "isPublicDocs": true, + "description": "A component that represents a single row in a table, which contains the data cells.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "clickDelegate", "value": "string", - "description": "The ID of an interactive element, such as `s-link`, in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally." + "description": "A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@elementInternals@3152", + "value": "ElementInternals", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -8843,7 +9969,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8851,43 +9977,57 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TableRow extends PreactCustomElement implements TableRowProps {\n constructor();\n accessor clickDelegate: string;\n}" + "value": "declare class TableRow extends PolarisCustomElement implements TableRowProps {\n /** @private */\n [elementInternals]: ElementInternals;\n constructor();\n /**\n * A CSS selector for a child element that should handle clicks on the entire row. When you set this property, clicking anywhere on the row will trigger a click on the element that matches the selector.\n */\n clickDelegate: string;\n}" } }, "Text": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Text", - "description": "Configure the following properties on the text component.", - "isPublicDocs": true, + "description": "A custom element for displaying inline or small blocks of text with various visual styles and semantic meanings. Use Text to render short pieces of content with appropriate styling, emphasis, and color treatment.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "fontVariantNumeric", - "value": "\"auto\" | \"normal\" | \"tabular-nums\"", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "tone", + "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", + "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "color", - "value": "\"base\" | \"subdued\"", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", - "defaultValue": "'base'" + "name": "fontVariantNumeric", + "value": "\"auto\" | \"normal\" | \"tabular-nums\"", + "description": "The numeric font variant for the text.", + "defaultValue": "'auto' - inherit from the parent element" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "tone", - "value": "\"info\" | \"success\" | \"warning\" | \"critical\" | \"auto\" | \"neutral\" | \"caution\"", - "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", - "defaultValue": "'auto'" + "name": "color", + "value": "\"base\" | \"subdued\"", + "description": "The color of the text.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", @@ -8902,7 +10042,7 @@ "syntaxKind": "PropertyDeclaration", "name": "dir", "value": "\"\" | \"auto\" | \"ltr\" | \"rtl\"", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "description": "The text direction (left-to-right or right-to-left).", "defaultValue": "''" }, { @@ -8910,7 +10050,7 @@ "syntaxKind": "PropertyDeclaration", "name": "accessibilityVisibility", "value": "\"visible\" | \"hidden\" | \"exclusive\"", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "The visibility of the element to assistive technologies.", "defaultValue": "'visible'" }, { @@ -8918,7 +10058,14 @@ "syntaxKind": "PropertyDeclaration", "name": "interestFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." + "description": "The ID of an element this text provides contextual information for." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -8965,7 +10112,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -8973,26 +10120,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class Text extends PreactCustomElement implements TextProps {\n accessor fontVariantNumeric: TextProps['fontVariantNumeric'];\n accessor color: TextProps['color'];\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n accessor tone: TextProps['tone'];\n /**\n * The semantic type and styling treatment for the text content.\n *\n * - `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n * - `generic`: Standard text with no special semantic meaning or styling.\n * - `address`: Marks the text as contact information, such as a physical or email address.\n * - `redundant`: Indicates the text is redundant or duplicated information for screen reader context.\n */\n accessor type: TextProps['type'];\n accessor dir: TextProps['dir'];\n accessor accessibilityVisibility: TextProps['accessibilityVisibility'];\n accessor interestFor: string;\n constructor();\n}" + "value": "declare class Text extends TextBase implements TextProps {\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: TextProps['tone'];\n constructor();\n}" } }, "TextArea": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "TextArea", - "description": "Configure the following properties on the text area component.", - "isPublicDocs": true, + "description": "The text area custom element class that renders a multi-line text input field in the Shopify admin interface. This component allows merchants to enter and edit longer text content with support for labels, validation, and length constraints.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the user can enter in the field.", "defaultValue": "Infinity" }, { @@ -9000,7 +10161,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation.", "defaultValue": "0" }, { @@ -9008,22 +10169,15 @@ "syntaxKind": "PropertyDeclaration", "name": "rows", "value": "number", - "description": "A number of visible text lines.", + "description": "The number of visible text lines for the field, controlling its initial height.", "defaultValue": "2" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -9031,35 +10185,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -9067,14 +10221,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -9082,7 +10236,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -9106,7 +10260,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -9130,7 +10284,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -9138,23 +10292,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@6805", + "name": "__@internals$4@2293", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -9192,7 +10360,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -9200,26 +10368,40 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextArea\n extends PreactFieldElement\n implements TextAreaProps\n{\n accessor maxLength: TextAreaProps['maxLength'];\n accessor minLength: TextAreaProps['minLength'];\n accessor rows: TextAreaProps['rows'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextArea extends TextAreaBase implements TextAreaProps {\n constructor();\n}" } }, "TextField": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "TextField", - "description": "Configure the following properties on the text field component.", - "isPublicDocs": true, + "description": "The text field custom element class that renders a single-line text input field in the Shopify admin interface. This component allows merchants to enter and edit text with support for labels, validation, icons, and prefix/suffix content.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "icon", - "value": "\"replace\" | \"search\" | \"split\" | \"link\" | \"edit\" | \"info\" | \"incomplete\" | \"complete\" | \"product\" | \"variant\" | \"collection\" | \"select\" | \"color\" | \"money\" | \"order\" | \"code\" | \"adjust\" | \"affiliate\" | \"airplane\" | \"alert-bubble\" | \"alert-circle\" | \"alert-diamond\" | \"alert-location\" | \"alert-octagon\" | \"alert-octagon-filled\" | \"alert-triangle\" | \"alert-triangle-filled\" | \"app-extension\" | \"apps\" | \"archive\" | \"arrow-down\" | \"arrow-down-circle\" | \"arrow-down-right\" | \"arrow-left\" | \"arrow-left-circle\" | \"arrow-right\" | \"arrow-right-circle\" | \"arrow-up\" | \"arrow-up-circle\" | \"arrow-up-right\" | \"arrows-in-horizontal\" | \"arrows-out-horizontal\" | \"asterisk\" | \"attachment\" | \"automation\" | \"backspace\" | \"bag\" | \"bank\" | \"barcode\" | \"battery-low\" | \"bill\" | \"blank\" | \"blog\" | \"bolt\" | \"bolt-filled\" | \"book\" | \"book-open\" | \"bug\" | \"bullet\" | \"business-entity\" | \"button\" | \"button-press\" | \"calculator\" | \"calendar\" | \"calendar-check\" | \"calendar-compare\" | \"calendar-list\" | \"calendar-time\" | \"camera\" | \"camera-flip\" | \"caret-down\" | \"caret-left\" | \"caret-right\" | \"caret-up\" | \"cart\" | \"cart-abandoned\" | \"cart-discount\" | \"cart-down\" | \"cart-filled\" | \"cart-sale\" | \"cart-send\" | \"cart-up\" | \"cash-dollar\" | \"cash-euro\" | \"cash-pound\" | \"cash-rupee\" | \"cash-yen\" | \"catalog-product\" | \"categories\" | \"channels\" | \"chart-cohort\" | \"chart-donut\" | \"chart-funnel\" | \"chart-histogram-first\" | \"chart-histogram-first-last\" | \"chart-histogram-flat\" | \"chart-histogram-full\" | \"chart-histogram-growth\" | \"chart-histogram-last\" | \"chart-histogram-second-last\" | \"chart-horizontal\" | \"chart-line\" | \"chart-popular\" | \"chart-stacked\" | \"chart-vertical\" | \"chat\" | \"chat-new\" | \"chat-referral\" | \"check\" | \"check-circle\" | \"check-circle-filled\" | \"checkbox\" | \"chevron-down\" | \"chevron-down-circle\" | \"chevron-left\" | \"chevron-left-circle\" | \"chevron-right\" | \"chevron-right-circle\" | \"chevron-up\" | \"chevron-up-circle\" | \"circle\" | \"circle-dashed\" | \"clipboard\" | \"clipboard-check\" | \"clipboard-checklist\" | \"clock\" | \"clock-list\" | \"clock-revert\" | \"code-add\" | \"collection-featured\" | \"collection-list\" | \"collection-reference\" | \"color-none\" | \"compass\" | \"compose\" | \"confetti\" | \"connect\" | \"content\" | \"contract\" | \"corner-pill\" | \"corner-round\" | \"corner-square\" | \"credit-card\" | \"credit-card-cancel\" | \"credit-card-percent\" | \"credit-card-reader\" | \"credit-card-reader-chip\" | \"credit-card-reader-tap\" | \"credit-card-secure\" | \"credit-card-tap-chip\" | \"crop\" | \"currency-convert\" | \"cursor\" | \"cursor-banner\" | \"cursor-option\" | \"data-presentation\" | \"data-table\" | \"database\" | \"database-add\" | \"database-connect\" | \"delete\" | \"delivered\" | \"delivery\" | \"desktop\" | \"disabled\" | \"disabled-filled\" | \"discount\" | \"discount-add\" | \"discount-automatic\" | \"discount-code\" | \"discount-remove\" | \"dns-settings\" | \"dock-floating\" | \"dock-side\" | \"domain\" | \"domain-landing-page\" | \"domain-new\" | \"domain-redirect\" | \"download\" | \"drag-drop\" | \"drag-handle\" | \"drawer\" | \"duplicate\" | \"email\" | \"email-follow-up\" | \"email-newsletter\" | \"empty\" | \"enabled\" | \"enter\" | \"envelope\" | \"envelope-soft-pack\" | \"eraser\" | \"exchange\" | \"exit\" | \"export\" | \"external\" | \"eye-check-mark\" | \"eye-dropper\" | \"eye-dropper-list\" | \"eye-first\" | \"eyeglasses\" | \"fav\" | \"favicon\" | \"file\" | \"file-list\" | \"filter\" | \"filter-active\" | \"flag\" | \"flip-horizontal\" | \"flip-vertical\" | \"flower\" | \"folder\" | \"folder-add\" | \"folder-down\" | \"folder-remove\" | \"folder-up\" | \"food\" | \"foreground\" | \"forklift\" | \"forms\" | \"games\" | \"gauge\" | \"geolocation\" | \"gift\" | \"gift-card\" | \"git-branch\" | \"git-commit\" | \"git-repository\" | \"globe\" | \"globe-asia\" | \"globe-europe\" | \"globe-lines\" | \"globe-list\" | \"graduation-hat\" | \"grid\" | \"hashtag\" | \"hashtag-decimal\" | \"hashtag-list\" | \"heart\" | \"hide\" | \"hide-filled\" | \"home\" | \"home-filled\" | \"icons\" | \"identity-card\" | \"image\" | \"image-add\" | \"image-alt\" | \"image-explore\" | \"image-magic\" | \"image-none\" | \"image-with-text-overlay\" | \"images\" | \"import\" | \"in-progress\" | \"incentive\" | \"incoming\" | \"info-filled\" | \"inheritance\" | \"inventory\" | \"inventory-edit\" | \"inventory-list\" | \"inventory-transfer\" | \"inventory-updated\" | \"iq\" | \"key\" | \"keyboard\" | \"keyboard-filled\" | \"keyboard-hide\" | \"keypad\" | \"label-printer\" | \"language\" | \"language-translate\" | \"layout-block\" | \"layout-buy-button\" | \"layout-buy-button-horizontal\" | \"layout-buy-button-vertical\" | \"layout-column-1\" | \"layout-columns-2\" | \"layout-columns-3\" | \"layout-footer\" | \"layout-header\" | \"layout-logo-block\" | \"layout-popup\" | \"layout-rows-2\" | \"layout-section\" | \"layout-sidebar-left\" | \"layout-sidebar-right\" | \"lightbulb\" | \"link-list\" | \"list-bulleted\" | \"list-bulleted-filled\" | \"list-numbered\" | \"live\" | \"live-critical\" | \"live-none\" | \"location\" | \"location-none\" | \"lock\" | \"map\" | \"markets\" | \"markets-euro\" | \"markets-rupee\" | \"markets-yen\" | \"maximize\" | \"measurement-size\" | \"measurement-size-list\" | \"measurement-volume\" | \"measurement-volume-list\" | \"measurement-weight\" | \"measurement-weight-list\" | \"media-receiver\" | \"megaphone\" | \"mention\" | \"menu\" | \"menu-filled\" | \"menu-horizontal\" | \"menu-vertical\" | \"merge\" | \"metafields\" | \"metaobject\" | \"metaobject-list\" | \"metaobject-reference\" | \"microphone\" | \"microphone-muted\" | \"minimize\" | \"minus\" | \"minus-circle\" | \"mobile\" | \"money-none\" | \"money-split\" | \"moon\" | \"nature\" | \"note\" | \"note-add\" | \"notification\" | \"number-one\" | \"order-batches\" | \"order-draft\" | \"order-filled\" | \"order-first\" | \"order-fulfilled\" | \"order-repeat\" | \"order-unfulfilled\" | \"orders-status\" | \"organization\" | \"outdent\" | \"outgoing\" | \"package\" | \"package-cancel\" | \"package-fulfilled\" | \"package-on-hold\" | \"package-reassign\" | \"package-returned\" | \"page\" | \"page-add\" | \"page-attachment\" | \"page-clock\" | \"page-down\" | \"page-heart\" | \"page-list\" | \"page-reference\" | \"page-remove\" | \"page-report\" | \"page-up\" | \"pagination-end\" | \"pagination-start\" | \"paint-brush-flat\" | \"paint-brush-round\" | \"paper-check\" | \"partially-complete\" | \"passkey\" | \"paste\" | \"pause-circle\" | \"payment\" | \"payment-capture\" | \"payout\" | \"payout-dollar\" | \"payout-euro\" | \"payout-pound\" | \"payout-rupee\" | \"payout-yen\" | \"person\" | \"person-add\" | \"person-exit\" | \"person-filled\" | \"person-list\" | \"person-lock\" | \"person-remove\" | \"person-segment\" | \"personalized-text\" | \"phablet\" | \"phone\" | \"phone-down\" | \"phone-down-filled\" | \"phone-in\" | \"phone-out\" | \"pin\" | \"pin-remove\" | \"plan\" | \"play\" | \"play-circle\" | \"plus\" | \"plus-circle\" | \"plus-circle-down\" | \"plus-circle-filled\" | \"plus-circle-up\" | \"point-of-sale\" | \"point-of-sale-register\" | \"price-list\" | \"print\" | \"product-add\" | \"product-cost\" | \"product-filled\" | \"product-list\" | \"product-reference\" | \"product-remove\" | \"product-return\" | \"product-unavailable\" | \"profile\" | \"profile-filled\" | \"question-circle\" | \"question-circle-filled\" | \"radio-control\" | \"receipt\" | \"receipt-dollar\" | \"receipt-euro\" | \"receipt-folded\" | \"receipt-paid\" | \"receipt-pound\" | \"receipt-refund\" | \"receipt-rupee\" | \"receipt-yen\" | \"receivables\" | \"redo\" | \"referral-code\" | \"refresh\" | \"remove-background\" | \"reorder\" | \"replay\" | \"reset\" | \"return\" | \"reward\" | \"rocket\" | \"rotate-left\" | \"rotate-right\" | \"sandbox\" | \"save\" | \"savings\" | \"scan-qr-code\" | \"search-add\" | \"search-list\" | \"search-recent\" | \"search-resource\" | \"send\" | \"settings\" | \"share\" | \"shield-check-mark\" | \"shield-none\" | \"shield-pending\" | \"shield-person\" | \"shipping-label\" | \"shipping-label-cancel\" | \"shopcodes\" | \"slideshow\" | \"smiley-happy\" | \"smiley-joy\" | \"smiley-neutral\" | \"smiley-sad\" | \"social-ad\" | \"social-post\" | \"sort\" | \"sort-ascending\" | \"sort-descending\" | \"sound\" | \"sports\" | \"star\" | \"star-circle\" | \"star-filled\" | \"star-half\" | \"star-list\" | \"status\" | \"status-active\" | \"stop-circle\" | \"store\" | \"store-import\" | \"store-managed\" | \"store-online\" | \"sun\" | \"table\" | \"table-masonry\" | \"tablet\" | \"target\" | \"tax\" | \"team\" | \"text\" | \"text-align-center\" | \"text-align-left\" | \"text-align-right\" | \"text-block\" | \"text-bold\" | \"text-color\" | \"text-font\" | \"text-font-list\" | \"text-grammar\" | \"text-in-columns\" | \"text-in-rows\" | \"text-indent\" | \"text-indent-remove\" | \"text-italic\" | \"text-quote\" | \"text-title\" | \"text-underline\" | \"text-with-image\" | \"theme\" | \"theme-edit\" | \"theme-store\" | \"theme-template\" | \"three-d-environment\" | \"thumbs-down\" | \"thumbs-up\" | \"tip-jar\" | \"toggle-off\" | \"toggle-on\" | \"transaction\" | \"transaction-fee-add\" | \"transaction-fee-dollar\" | \"transaction-fee-euro\" | \"transaction-fee-pound\" | \"transaction-fee-rupee\" | \"transaction-fee-yen\" | \"transfer\" | \"transfer-in\" | \"transfer-internal\" | \"transfer-out\" | \"truck\" | \"undo\" | \"unknown-device\" | \"unlock\" | \"upload\" | \"variant-list\" | \"video\" | \"video-list\" | \"view\" | \"viewport-narrow\" | \"viewport-short\" | \"viewport-tall\" | \"viewport-wide\" | \"wallet\" | \"wand\" | \"watch\" | \"wifi\" | \"work\" | \"work-list\" | \"wrench\" | \"x\" | \"x-circle\" | \"x-circle-filled\" | AnyString", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "value": "IconType | AnyString", + "description": "An icon to display at the start of the text field, providing visual context for the input. Accepts any valid icon type from the admin icon set, or an empty string to display no icon.", "defaultValue": "''" }, { @@ -9227,7 +10409,7 @@ "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters the merchant can enter in the field. When this limit is reached, the field prevents further input.", "defaultValue": "Infinity" }, { @@ -9235,7 +10417,7 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the field for validation. The field will be considered invalid if the merchant enters fewer characters than this value.", "defaultValue": "0" }, { @@ -9243,7 +10425,7 @@ "syntaxKind": "PropertyDeclaration", "name": "prefix", "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "description": "Text or content to display before the merchant's input, such as a currency symbol (`$`) or protocol (`https://`).", "defaultValue": "''" }, { @@ -9251,22 +10433,15 @@ "syntaxKind": "PropertyDeclaration", "name": "suffix", "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", + "description": "Text or content to display after the merchant's input, such as a unit of measurement (`kg`, `%`) or domain (`.myshopify.com`).", "defaultValue": "''" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", - "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} name` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping name\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing name\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping name` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing name` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "value": "\"on\" | \"off\" | TextAutocompleteField | `section-${string} one-time-code` | \"shipping one-time-code\" | \"billing one-time-code\" | `section-${string} shipping one-time-code` | `section-${string} billing one-time-code` | `section-${string} language` | `section-${string} organization` | `section-${string} additional-name` | `section-${string} address-level1` | `section-${string} address-level2` | `section-${string} address-level3` | `section-${string} address-level4` | `section-${string} address-line1` | `section-${string} address-line2` | `section-${string} address-line3` | `section-${string} country-name` | `section-${string} country` | `section-${string} family-name` | `section-${string} given-name` | `section-${string} honorific-prefix` | `section-${string} honorific-suffix` | `section-${string} name` | `section-${string} nickname` | `section-${string} organization-title` | `section-${string} postal-code` | `section-${string} sex` | `section-${string} street-address` | `section-${string} transaction-currency` | `section-${string} username` | `section-${string} cc-additional-name` | `section-${string} cc-family-name` | `section-${string} cc-given-name` | `section-${string} cc-name` | `section-${string} cc-type` | \"shipping language\" | \"shipping organization\" | \"shipping additional-name\" | \"shipping address-level1\" | \"shipping address-level2\" | \"shipping address-level3\" | \"shipping address-level4\" | \"shipping address-line1\" | \"shipping address-line2\" | \"shipping address-line3\" | \"shipping country-name\" | \"shipping country\" | \"shipping family-name\" | \"shipping given-name\" | \"shipping honorific-prefix\" | \"shipping honorific-suffix\" | \"shipping name\" | \"shipping nickname\" | \"shipping organization-title\" | \"shipping postal-code\" | \"shipping sex\" | \"shipping street-address\" | \"shipping transaction-currency\" | \"shipping username\" | \"shipping cc-additional-name\" | \"shipping cc-family-name\" | \"shipping cc-given-name\" | \"shipping cc-name\" | \"shipping cc-type\" | \"billing language\" | \"billing organization\" | \"billing additional-name\" | \"billing address-level1\" | \"billing address-level2\" | \"billing address-level3\" | \"billing address-level4\" | \"billing address-line1\" | \"billing address-line2\" | \"billing address-line3\" | \"billing country-name\" | \"billing country\" | \"billing family-name\" | \"billing given-name\" | \"billing honorific-prefix\" | \"billing honorific-suffix\" | \"billing name\" | \"billing nickname\" | \"billing organization-title\" | \"billing postal-code\" | \"billing sex\" | \"billing street-address\" | \"billing transaction-currency\" | \"billing username\" | \"billing cc-additional-name\" | \"billing cc-family-name\" | \"billing cc-given-name\" | \"billing cc-name\" | \"billing cc-type\" | `section-${string} shipping language` | `section-${string} shipping organization` | `section-${string} shipping additional-name` | `section-${string} shipping address-level1` | `section-${string} shipping address-level2` | `section-${string} shipping address-level3` | `section-${string} shipping address-level4` | `section-${string} shipping address-line1` | `section-${string} shipping address-line2` | `section-${string} shipping address-line3` | `section-${string} shipping country-name` | `section-${string} shipping country` | `section-${string} shipping family-name` | `section-${string} shipping given-name` | `section-${string} shipping honorific-prefix` | `section-${string} shipping honorific-suffix` | `section-${string} shipping name` | `section-${string} shipping nickname` | `section-${string} shipping organization-title` | `section-${string} shipping postal-code` | `section-${string} shipping sex` | `section-${string} shipping street-address` | `section-${string} shipping transaction-currency` | `section-${string} shipping username` | `section-${string} shipping cc-additional-name` | `section-${string} shipping cc-family-name` | `section-${string} shipping cc-given-name` | `section-${string} shipping cc-name` | `section-${string} shipping cc-type` | `section-${string} billing language` | `section-${string} billing organization` | `section-${string} billing additional-name` | `section-${string} billing address-level1` | `section-${string} billing address-level2` | `section-${string} billing address-level3` | `section-${string} billing address-level4` | `section-${string} billing address-line1` | `section-${string} billing address-line2` | `section-${string} billing address-line3` | `section-${string} billing country-name` | `section-${string} billing country` | `section-${string} billing family-name` | `section-${string} billing given-name` | `section-${string} billing honorific-prefix` | `section-${string} billing honorific-suffix` | `section-${string} billing name` | `section-${string} billing nickname` | `section-${string} billing organization-title` | `section-${string} billing postal-code` | `section-${string} billing sex` | `section-${string} billing street-address` | `section-${string} billing transaction-currency` | `section-${string} billing username` | `section-${string} billing cc-additional-name` | `section-${string} billing cc-family-name` | `section-${string} billing cc-given-name` | `section-${string} billing cc-name` | `section-${string} billing cc-type`", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", "defaultValue": "'on' for everything else" }, { @@ -9274,35 +10449,35 @@ "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -9310,14 +10485,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -9325,7 +10500,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -9349,7 +10524,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -9373,7 +10548,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -9381,23 +10556,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@6805", + "name": "__@internals$4@2293", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -9435,7 +10624,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -9443,43 +10632,64 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class TextField\n extends PreactFieldElement\n implements TextFieldProps\n{\n accessor icon: TextFieldProps['icon'];\n accessor maxLength: TextFieldProps['maxLength'];\n accessor minLength: TextFieldProps['minLength'];\n accessor prefix: TextFieldProps['prefix'];\n accessor suffix: TextFieldProps['suffix'];\n /**\n * The current text value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class TextField extends TextFieldBase implements TextFieldProps {\n constructor();\n}" } }, "Thumbnail": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Thumbnail", - "description": "Configure the following properties on the thumbnail component.", - "isPublicDocs": true, + "description": "A thumbnail displays a small preview image with configurable sizing.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered." + "description": "The URL of the image to display in the thumbnail." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "alt", "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", - "defaultValue": "``" + "description": "Alternative text that describes the image for screen readers.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "size", "value": "\"small\" | \"small-200\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the product thumbnail image.\n\n- `small-200`: Smallest thumbnail size, ideal for compact product lists or tables.\n- `small-100`: Very small thumbnail, suitable for dense layouts.\n- `small`: Small thumbnail for space-constrained contexts.\n- `base`: Default size that balances visibility and space efficiency.\n- `large`: Larger thumbnail for featured products or detailed views.\n- `large-100`: Extra large thumbnail for prominent product display.", + "description": "The size of the thumbnail.", "defaultValue": "'base'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -9525,7 +10735,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -9533,24 +10743,38 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Thumbnail extends PreactCustomElement implements ThumbnailProps {\n accessor src: ThumbnailProps['src'];\n accessor alt: ThumbnailProps['alt'];\n accessor size: ThumbnailProps['size'];\n constructor();\n}" - } - }, - "Tooltip": { + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Thumbnail extends PolarisCustomElement implements ThumbnailProps {\n /**\n * The URL of the image to display in the thumbnail.\n */\n src: ThumbnailProps['src'];\n /**\n * Alternative text that describes the image for screen readers.\n */\n alt: ThumbnailProps['alt'];\n /**\n * The size of the thumbnail.\n */\n size: ThumbnailProps['size'];\n constructor();\n}" + } + }, + "Tooltip": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Tooltip", - "description": "Configure the following properties on the tooltip component.", - "isPublicDocs": true, + "description": "A component that displays a small popup with explanatory text when the user hovers over or focuses on an element.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@7174", + "name": "__@overlayHidden@2725", "value": "boolean", "description": "", "isPrivate": true @@ -9558,7 +10782,7 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@7175", + "name": "__@overlayActivator@2726", "value": "HTMLElement", "description": "", "isPrivate": true @@ -9566,11 +10790,18 @@ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@7176", + "name": "__@overlayHideFrameId@2727", "value": "number", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -9616,7 +10847,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -9624,8 +10855,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class Tooltip extends PreactOverlayElement implements TooltipProps {\n constructor();\n}" @@ -9635,9 +10881,15 @@ "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "UnorderedList", - "description": "Configure the following properties on the unordered list component.", - "isPublicDocs": true, + "description": "A custom element for displaying a bulleted list of items where the order doesn't matter. Use unordered list when you have a collection of related items without a specific sequence, such as features, options, or bullet points.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -9683,7 +10935,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -9691,34 +10943,48 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class UnorderedList\n extends PreactCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" + "value": "declare class UnorderedList\n extends PolarisCustomElement\n implements UnorderedListProps\n{\n constructor();\n}" } }, "URLField": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "URLField", - "description": "Configure the following properties on the URL field component.", - "isPublicDocs": true, + "description": "The URL field custom element class that renders a URL input field in the Shopify admin interface. This component allows merchants to enter web addresses with automatic URL validation and appropriate mobile keyboard layouts.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "autocomplete", "value": "\"on\" | \"off\" | `section-${string} url` | `section-${string} photo` | `section-${string} impp` | `section-${string} home impp` | `section-${string} mobile impp` | `section-${string} fax impp` | `section-${string} pager impp` | \"shipping url\" | \"shipping photo\" | \"shipping impp\" | \"shipping home impp\" | \"shipping mobile impp\" | \"shipping fax impp\" | \"shipping pager impp\" | \"billing url\" | \"billing photo\" | \"billing impp\" | \"billing home impp\" | \"billing mobile impp\" | \"billing fax impp\" | \"billing pager impp\" | `section-${string} shipping url` | `section-${string} shipping photo` | `section-${string} shipping impp` | `section-${string} shipping home impp` | `section-${string} shipping mobile impp` | `section-${string} shipping fax impp` | `section-${string} shipping pager impp` | `section-${string} billing url` | `section-${string} billing photo` | `section-${string} billing impp` | `section-${string} billing home impp` | `section-${string} billing mobile impp` | `section-${string} billing fax impp` | `section-${string} billing pager impp` | URLAutocompleteField", - "description": "Controls browser autofill behavior for the field.\n\nBasic values:\n- `on` - Enables autofill without specifying content type (default)\n- `off` - Disables autofill for sensitive data or one-time codes\n\nSpecific field values describe the expected data type. You can optionally prefix these with:\n- `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n- `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n- Both section and group (for example, `section-primary shipping email`)\n\nProviding a specific autofill token helps browsers suggest more relevant saved data.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "defaultValue": "'on' for everything else" + "description": "A hint about the intended content of the field for browser autofill.", + "defaultValue": "'url'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "maxLength", "value": "number", - "description": "The maximum number of characters allowed in the field.", + "description": "The maximum number of characters allowed in the URL.", "defaultValue": "Infinity" }, { @@ -9726,50 +10992,43 @@ "syntaxKind": "PropertyDeclaration", "name": "minLength", "value": "number", - "description": "The minimum number of characters required in the field.", + "description": "The minimum number of characters required in the URL.", "defaultValue": "0" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "value", - "value": "string", - "description": "The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing." - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "defaultValue", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead." + "description": "The default value for the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers." + "value": "any", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers." + "value": "any", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide." + "value": "any", + "description": "Content to use as the field label." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "labelAccessibilityVisibility", "value": "\"visible\" | \"exclusive\"", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "defaultValue": "'visible'" }, { @@ -9777,14 +11036,14 @@ "syntaxKind": "PropertyDeclaration", "name": "placeholder", "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value." + "description": "A short hint that describes the expected value of the field." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "readOnly", "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "defaultValue": "false" }, { @@ -9792,7 +11051,7 @@ "syntaxKind": "PropertyDeclaration", "name": "required", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "defaultValue": "false" }, { @@ -9816,7 +11075,7 @@ "syntaxKind": "GetAccessor", "name": "isContentEditable", "value": "boolean", - "description": "Whether the shadow tree contains a focused input (input, textarea, select, ).\n\nNote: this does _not_ return true for focussed non-field form elements like buttons.", + "description": "Checks if the shadow tree contains a focused input (input, textarea, select, ). Note: this does _not_ return true for focussed non-field form elements like buttons.", "isPrivate": true }, { @@ -9840,7 +11099,7 @@ "syntaxKind": "PropertyDeclaration", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the field, disallowing any interaction.", "defaultValue": "false" }, { @@ -9848,23 +11107,37 @@ "syntaxKind": "PropertyDeclaration", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting." + "description": "A unique identifier for the element." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "name", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form." + "description": "An identifier for the field that is unique within the nearest containing form." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", - "name": "__@internals$4@6805", + "name": "__@internals$4@2293", "value": "ElementInternals", "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -9902,7 +11175,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -9910,11 +11183,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class URLField\n extends PreactFieldElement\n implements URLFieldProps\n{\n accessor autocomplete: URLFieldProps['autocomplete'];\n accessor maxLength: URLFieldProps['maxLength'];\n accessor minLength: URLFieldProps['minLength'];\n /**\n * The current URL value in the field as a string. When setting this property programmatically, it updates the field's display value. When reading it, you get the user's current input. The field validates this value as a URL format when the user finishes editing.\n */\n get value(): string;\n set value(value: string);\n constructor();\n}" + "value": "declare class URLField extends URLFieldBase implements URLFieldProps {\n constructor();\n}" } }, "URLAutocompleteField": { @@ -9923,32 +11211,37 @@ "syntaxKind": "TypeAliasDeclaration", "name": "URLAutocompleteField", "value": "'url' | 'photo' | 'impp' | 'home impp' | 'mobile impp' | 'fax impp' | 'pager impp'", - "description": "Represents autocomplete values that are valid for URL input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for URL inputs.\n\nAvailable values:\n- `url` - General URL or web address\n- `photo` - URL to a photo or image\n- `impp` - Instant messaging protocol URL\n- `home impp` - Home instant messaging protocol URL\n- `mobile impp` - Mobile instant messaging protocol URL\n- `fax impp` - Fax instant messaging protocol URL\n- `pager impp` - Pager instant messaging protocol URL", - "isPublicDocs": true + "description": "" } }, "AdminAction": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminAction", - "description": "Configure the following properties on the admin action component.", - "isPublicDocs": true, + "description": "The admin action custom element class that renders action controls in the Shopify admin interface. This component creates a standardized action area with a heading and slots for primary and secondary action buttons, used exclusively in admin action extensions.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text to use as the Action modal's title. If not provided, the name of the extension will be used." + "description": "The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "loading", "value": "boolean", - "description": "Whether the action is in a loading state, such as during initial page load or when the action is being opened. When `true`, the action might be in an inert state that prevents user interaction.", + "description": "Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.", "defaultValue": "false" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -9994,7 +11287,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -10002,11 +11295,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminAction\n extends PreactCustomElement\n implements AdminActionProps\n{\n /**\n * The text to use as the Action modal's title. If not provided, the name of the extension will be used.\n */\n heading: string;\n /**\n * Whether the action is in a loading state, such as during initial page load or when the action is being opened.\n * When `true`, the action might be in an inert state that prevents user interaction.\n */\n loading: boolean;\n constructor();\n}" + "value": "declare class AdminAction\n extends PolarisCustomElement\n implements AdminActionProps\n{\n /**\n * The heading text to display at the top of the action area. This title describes the action or task the merchant is performing. If not provided, the extension name is used as the heading.\n */\n heading: string;\n /**\n * Whether the action extension is currently in a loading state, such as during initial data fetching or when opening the action. When `true`, the action area might display loading indicators and prevent user interaction until loading completes.\n *\n * @default false\n */\n loading: boolean;\n constructor();\n}" } }, "RunnableExtension": { @@ -10233,22 +11541,28 @@ "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminBlock", - "description": "Configure the following properties on the admin block component.", - "isPublicDocs": true, + "description": "The admin block custom element class that renders a collapsible content block in the Shopify admin interface. This component organizes content into expandable sections with headings and provides a summary when collapsed.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "heading", "value": "string", - "description": "The text displayed as the block's title in the header. If not provided, the extension name will be used." + "description": "The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "collapsedSummary", "value": "string", - "description": "The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated." + "description": "The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -10295,7 +11609,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -10303,20 +11617,41 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminBlock\n extends PreactCustomElement\n implements AdminBlockProps\n{\n /**\n * The text displayed as the block's title in the header. If not provided, the extension name will be used.\n */\n heading: string;\n /**\n * The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated.\n */\n collapsedSummary: string;\n constructor();\n}" + "value": "declare class AdminBlock\n extends PolarisCustomElement\n implements AdminBlockProps\n{\n /**\n * The heading text to display at the top of the block. This title describes the content section the merchant is viewing. If not provided, no heading is displayed.\n */\n heading: string;\n /**\n * The summary text to display when the block is collapsed. This provides merchants with a preview of the block's contents without expanding it. If not provided, no summary is displayed.\n */\n collapsedSummary: string;\n constructor();\n}" } }, "Form": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Form", - "description": "Configure the following properties on the form component.", - "isPublicDocs": true, + "description": "The form custom element class that renders a form container in the Shopify admin interface. This component manages form submission, validation, and reset behavior for collecting merchant input.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -10362,7 +11697,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -10370,11 +11705,120 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Form extends PolarisCustomElement implements FormProps {\n constructor();\n}" + } + }, + "IntentRenderApi": { + "src/surfaces/admin/api/intents/intent-render.ts": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderApi", + "description": "The `IntentRenderApi` object provides methods for extensions that render in response to an app intent. Access the intent data to determine what action the merchant requested and use `intents.response` to resolve the intent when complete.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "auth", + "value": "Auth", + "description": "Provides methods for authenticating calls to your app backend. Use the `idToken()` method to retrieve a signed JWT token that verifies the current user's identity for secure server-side operations." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "extension", + "value": "{ target: ExtensionTarget; }", + "description": "The identifier of the running extension target. Use this to determine which target your extension is rendering in and conditionally adjust functionality or UI based on the extension context." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "i18n", + "value": "I18n", + "description": "Utilities for translating content according to the current localization of the admin. Use these methods to provide translated strings that match the merchant's language preferences, ensuring your extension is accessible to a global audience." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "intents", + "value": "IntentRenderIntents", + "description": "Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "picker", + "value": "PickerApi", + "description": "Opens a custom selection dialog with your app-specific data. Use the [Picker API](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/picker-api) to define the picker's heading, items, headers, and selection behavior. Returns a Promise that resolves to a `Picker` object with a `selected` property for accessing the merchant's selection." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "query", + "value": "(query: string, options?: { variables?: Variables; version?: Omit; }) => Promise<{ data?: Data; errors?: GraphQLError[]; }>", + "description": "Executes GraphQL queries against the [GraphQL Admin API](/docs/api/admin-graphql). Use this to fetch shop data, manage resources, or perform mutations. Queries are automatically authenticated with the current user's permissions. Optionally specify GraphQL variables and API version for your query." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "resourcePicker", + "value": "ResourcePickerApi", + "description": "Opens the [resource picker](/docs/api/admin-extensions/{API_VERSION}/target-apis/utility-apis/resource-picker-api) modal for selecting products, variants, or collections. Returns the selected resources when the user confirms their selection, or undefined if they cancel." + }, + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "storage", + "value": "Storage", + "description": "Provides methods for persisting data in browser storage that is scoped to your extension. Use this to store user preferences, cache data, maintain state across sessions, or save temporary working data. Storage is persistent across page reloads and isolated per extension." + } + ], + "value": "export interface IntentRenderApi\n extends StandardRenderingExtensionApi {\n /**\n * Provides methods for resolving the current intent. Always available for intent render extensions since they are always invoked inside an intent workflow.\n */\n intents: IntentRenderIntents;\n}" + } + }, + "IntentRenderIntents": { + "src/surfaces/admin/api/intents/intent-render.ts": { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "name": "IntentRenderIntents", + "description": "The intents API available to intent render extensions. Unlike other targets where `response` is optional, intent render extensions always run inside an intent workflow so `response` is guaranteed.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/api/intents/intent-render.ts", + "syntaxKind": "PropertySignature", + "name": "response", + "value": "IntentResponseApi", + "description": "Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled." } ], - "value": "declare class Form extends PreactCustomElement implements FormProps {\n constructor();\n}" + "value": "export interface IntentRenderIntents {\n /**\n * Resolves the current intent from within the invoked extension. Use `ok()` to signal success, `error()` to report failure, or `closed()` to indicate the merchant cancelled.\n */\n response: IntentResponseApi;\n}" + } + }, + "FormExtensionComponents": { + "src/surfaces/admin/components/FormExtensionComponents.ts": { + "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "FormExtensionComponents", + "value": "StandardComponents | 'Form'", + "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." } }, "StandardApi": { @@ -11040,22 +12484,19 @@ "description": "The components available for building function settings extensions. Includes all form components plus the function settings component required for function settings configuration." } }, - "FormExtensionComponents": { - "src/surfaces/admin/components/FormExtensionComponents.ts": { - "filePath": "src/surfaces/admin/components/FormExtensionComponents.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "FormExtensionComponents", - "value": "StandardComponents | 'Form'", - "description": "The components available for building form-based extensions. Includes all standard components plus the form component for creating structured data collection interfaces with submission handling and validation." - } - }, "FunctionSettings": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "FunctionSettings", - "description": "Configure the following properties on the function settings component.", - "isPublicDocs": true, + "description": "The function settings custom element class that renders a specialized form for configuring Shopify Function settings in the admin interface. This component manages function configuration submission, validation, and error handling.", "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -11101,7 +12542,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -11109,8 +12550,23 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], "value": "declare class FunctionSettings\n extends PreactCustomElement\n implements FunctionSettingsProps\n{\n constructor();\n}" @@ -11203,15 +12659,21 @@ "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "AdminPrintAction", - "description": "Configure the following properties on the admin print action component.", - "isPublicDocs": true, + "description": "The admin print action custom element class that renders a print interface in the Shopify admin. This component enables merchants to print content from a specified source URL using the browser's print functionality.", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertyDeclaration", "name": "src", "value": "string", - "description": "The `src` URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs, and images are supported." + "description": "The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." }, { "filePath": "src/surfaces/admin/components.ts", @@ -11258,7 +12720,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -11266,11 +12728,26 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." } ], - "value": "declare class AdminPrintAction\n extends PreactCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The `src` URL of the preview and the document to print.\n * If not provided, the preview will show an empty state and the print button will be disabled.\n * HTML, PDFs, and images are supported.\n */\n src: string;\n constructor();\n}" + "value": "declare class AdminPrintAction\n extends PolarisCustomElement\n implements AdminPrintActionProps\n{\n /**\n * The source URL of the content to print. This should point to the document or page that'll be sent to the printer when the merchant initiates the print action.\n */\n src: string;\n constructor();\n}" } }, "ProductDetailsConfigurationApi": { @@ -12160,7 +13637,7 @@ "filePath": "src/surfaces/admin/api/intents/intents.ts", "syntaxKind": "PropertySignature", "name": "issues", - "value": "{ path?: string[]; message?: string; code?: string; }[]", + "value": "Issue[]", "description": "Specific validation issues or field errors. Present when validation fails on particular fields, allowing you to show targeted error messages.", "isOptional": true }, @@ -12173,7 +13650,7 @@ "isOptional": true } ], - "value": "export interface ErrorIntentResponse {\n /** Indicates the workflow failed. When `'error'`, the workflow encountered validation errors or other issues that prevented completion. */\n code?: 'error';\n /** A general error message describing what went wrong. Use this to display feedback when specific field errors aren't available. */\n message?: string;\n /** Specific validation issues or field errors. Present when validation fails on particular fields, allowing you to show targeted error messages. */\n issues?: {\n /** The path to the field that has an error (for example, `['product', 'title']`). Use this to identify which field caused the validation failure. */\n path?: string[];\n /** A description of what's wrong with this field. Display this to help merchants understand how to fix the error. */\n message?: string;\n /** A machine-readable error code for this issue. Use this for programmatic error handling or logging. */\n code?: string;\n }[];\n}" + "value": "export interface ErrorIntentResponse {\n /** Indicates the workflow failed. When `'error'`, the workflow encountered validation errors or other issues that prevented completion. */\n code?: 'error';\n /** A general error message describing what went wrong. Use this to display feedback when specific field errors aren't available. */\n message?: string;\n /** Specific validation issues or field errors. Present when validation fails on particular fields, allowing you to show targeted error messages. */\n issues?: Issue[];\n}" } }, "IntentResponse": { @@ -12518,8 +13995,7 @@ "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "name": "Page", - "description": "Use as the outer wrapper of a page.", - "isPublicDocs": true, + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", @@ -12552,6 +14028,13 @@ "description": "", "isPrivate": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "GetAccessor", + "name": "updateComplete", + "value": "Promise", + "description": "A promise that resolves after the next render completes. Useful for non-React consumers who need to wait for the shadow DOM to be populated after setting properties." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "MethodDeclaration", @@ -12581,7 +14064,7 @@ "syntaxKind": "MethodDeclaration", "name": "queueRender", "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", + "description": "Queue a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", "isPrivate": true }, { @@ -12589,17 +14072,32 @@ "syntaxKind": "MethodDeclaration", "name": "click", "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", + "description": "Like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", "isPrivate": true - } - ], - "value": "declare class Page extends PreactCustomElement implements PageProps {\n accessor inlineSize: PageProps['inlineSize'];\n accessor heading: PageProps['heading'];\n constructor();\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n}" - } - }, - "IntentQueryOptions": { - "src/surfaces/admin/api/intents/intents.ts": { - "filePath": "src/surfaces/admin/api/intents/intents.ts", - "name": "IntentQueryOptions", + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertyDeclaration", + "name": "__@shadowRootSymbol@1691", + "value": "ShadowRoot", + "description": "", + "isPrivate": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodDeclaration", + "name": "__@flushRenderSymbol@1692", + "value": "() => void", + "description": "Flush any pending render synchronously.\n\nCalled by reactWrap's useLayoutEffect after all props are set, ensuring the shadow DOM is populated before the consumer's useLayoutEffect fires. The version counter invalidates any pending microtask so the total render count stays at 1.\n\nUses a Symbol key so this method is not callable by external consumers — only internal code that imports flushRenderSymbol can invoke it.\n\nGuarded by #hasPendingRender to avoid spurious Preact re-renders. React creates a new props object reference on every parent render, so reactWrap's useLayoutEffect (which depends on [props]) fires even when no prop *values* changed. Without the guard, every unrelated parent re-render would trigger a full Preact reconciliation — proportional to parent re-render frequency." + } + ], + "value": "declare class Page extends PageBase implements PageProps {\n constructor();\n}" + } + }, + "IntentQueryOptions": { + "src/surfaces/admin/api/intents/intents.ts": { + "filePath": "src/surfaces/admin/api/intents/intents.ts", + "name": "IntentQueryOptions", "description": "Additional parameters for intent invocation when using the string query format. Use these options to provide resource IDs for editing or pass required context data for resource creation.", "isPublicDocs": true, "members": [ @@ -12948,677 +14446,778 @@ "value": "export interface OrderRoutingRule {\n /** The display label for the order routing rule shown to merchants in the admin. Use this to identify the rule in lists and settings pages. */\n label: string;\n /** A description explaining the rule's purpose and how it routes orders. Use this to help merchants understand what the rule does. */\n description: string;\n /** The unique global identifier (GID) for the order routing rule. Use this ID to associate configuration changes with the correct rule. */\n id: string;\n /** The priority order for rule evaluation when multiple rules exist. Lower numbers are evaluated first (for example, a rule with priority 1 runs before priority 2). Use this to understand the rule's position in the evaluation sequence. */\n priority?: number;\n /** An array of [metafields](/docs/apps/build/metafields) that store the routing rule's configuration values. Use these metafields to populate your settings UI with the current rule configuration. */\n metafields: Metafield[];\n}" } }, - "ComponentChildren": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ComponentChildren", - "value": "preact.ComponentChildren", - "description": "Represents any valid children that can be rendered within a component, including elements, strings, numbers, or arrays of these types. This is an alias for Preact's `ComponentChildren` type.", - "isPublicDocs": true - } - }, - "StringChildren": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "StringChildren", - "value": "string", - "description": "Represents string-only children for components that specifically require text content.", - "isPublicDocs": true - } - }, - "ActionProps": { + "AvatarProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ActionProps", - "description": "", + "name": "AvatarProps", + "description": "The properties for the avatar component. An avatar displays a user or entity image with fallback initials when the image isn't available. Properties include `src` for the image URL, `initials` for the fallback text, `alt` for accessibility text, and `size` for controlling the avatar dimensions.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "heading", + "name": "alt", "value": "string", - "description": "The text to use as the action modal's title. If not provided, the name of the extension will be used.", - "isOptional": true - } - ], - "value": "export interface ActionProps {\n /**\n * The text to use as the action modal's title. If not provided, the name of the extension will be used.\n */\n heading?: string;\n}" - } - }, - "ActionSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ActionSlots", - "description": "The action component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "description": "Alternative text that describes the avatar for screen readers. This text should identify who or what the avatar represents." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "primaryAction", - "value": "ComponentChildren", - "description": "The primary action button or link, representing the main or most important action available in this context. Typically displayed with higher visual prominence than secondary actions to establish clear hierarchy.", - "isOptional": true + "name": "initials", + "value": "string", + "description": "The initials to display when no image is provided or if the image fails to load. This typically includes the first letter of a user's first and last name (for example, `'JD'` for John Doe)." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondaryActions", - "value": "ComponentChildren", - "description": "Additional action buttons or links that provide alternative or supporting actions. Visually de-emphasized compared to the primary action.", - "isOptional": true + "name": "size", + "value": "'small' | 'small-200' | 'base' | 'large' | 'large-200'", + "description": "The size of the avatar. Choose from `'small-200'`, `'small'`, `'base'`, `'large'`, or `'large-200'` to control the avatar dimensions.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "src", + "value": "string", + "description": "The URL of the avatar image to display. You can provide an absolute or relative URL pointing to the image file." } ], - "value": "export interface ActionSlots {\n /**\n * The primary action button or link, representing the main or most important action available in this context.\n * Typically displayed with higher visual prominence than secondary actions to establish clear hierarchy.\n */\n primaryAction?: ComponentChildren;\n /**\n * Additional action buttons or links that provide alternative or supporting actions.\n * Visually de-emphasized compared to the primary action.\n */\n secondaryActions?: ComponentChildren;\n}" + "value": "export interface AvatarProps\n extends Required> {\n /**\n * The initials to display when no image is provided or if the image fails to load. This typically includes the first letter of a user's first and last name (for example, `'JD'` for John Doe).\n */\n initials: RequiredAvatarProps['initials'];\n /**\n * The URL of the avatar image to display. You can provide an absolute or relative URL pointing to the image file.\n */\n src: RequiredAvatarProps['src'];\n /**\n * Alternative text that describes the avatar for screen readers. This text should identify who or what the avatar represents.\n */\n alt: RequiredAvatarProps['alt'];\n /**\n * The size of the avatar. Choose from `'small-200'`, `'small'`, `'base'`, `'large'`, or `'large-200'` to control the avatar dimensions.\n *\n * @default 'base'\n */\n size: Extract<\n AvatarProps$1['size'],\n 'small-200' | 'small' | 'base' | 'large' | 'large-200'\n >;\n}" } }, - "BaseOverlayProps": { + "ReactProps$$": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseOverlayProps", - "description": "", + "name": "ReactProps$$", + "description": "The properties for the avatar component when it's used in JSX.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onAfterHide", - "value": "(event: Event) => void", - "description": "A callback fired when the overlay is hidden, after any hide animations have completed.", - "isOptional": true + "name": "alt", + "value": "string", + "description": "Alternative text that describes the avatar for screen readers. This text should identify who or what the avatar represents." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onAfterShow", - "value": "(event: Event) => void", - "description": "A callback fired when the overlay is shown, after any show animations have completed.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onHide", - "value": "(event: Event) => void", - "description": "A callback fired immediately after the overlay is hidden.", + "name": "initials", + "value": "string", + "description": "The initials to display when no image is provided or if the image fails to load. This typically includes the first letter of a user's first and last name (for example, `'JD'` for John Doe)." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onError", + "value": "() => void", + "description": "A callback that's fired when the avatar image fails to load.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onShow", - "value": "(event: Event) => void", - "description": "A callback fired immediately after the overlay is shown.", + "name": "onLoad", + "value": "() => void", + "description": "A callback that's fired when the avatar image has loaded successfully.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "size", + "value": "'small' | 'small-200' | 'base' | 'large' | 'large-200'", + "description": "The size of the avatar. Choose from `'small-200'`, `'small'`, `'base'`, `'large'`, or `'large-200'` to control the avatar dimensions.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "src", + "value": "string", + "description": "The URL of the avatar image to display. You can provide an absolute or relative URL pointing to the image file." } ], - "value": "export interface BaseOverlayProps {\n /**\n * A callback fired immediately after the overlay is shown.\n */\n onShow?: (event: Event) => void;\n /**\n * A callback fired when the overlay is shown, after any show animations have completed.\n */\n onAfterShow?: (event: Event) => void;\n /**\n * A callback fired immediately after the overlay is hidden.\n */\n onHide?: (event: Event) => void;\n /**\n * A callback fired when the overlay is hidden, after any hide animations have completed.\n */\n onAfterHide?: (event: Event) => void;\n}" + "value": "export interface ReactProps$$\n extends Partial,\n Pick {\n /**\n * A callback that's fired when the avatar image has loaded successfully.\n */\n onLoad?: () => void;\n /**\n * A callback that's fired when the avatar image fails to load.\n */\n onError?: () => void;\n}" } }, - "BaseOverlayMethods": { + "BadgeProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseOverlayMethods", - "description": "Shared interface for web component methods that control overlay visibility.\n\nAll methods are required (not optional) because components implementing this interface must provide consistent JavaScript APIs. Unlike props/attributes, methods are not rendered in HTML and consumers expect them to be available on all component instances.", + "name": "BadgeProps", + "description": "The properties for the badge component. Badges display status information through compact visual indicators with customizable tones, sizes, and optional icons.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "hideOverlay", - "value": "() => void", - "description": "A method to programmatically hide the overlay." + "name": "color", + "value": "'base' | 'strong'", + "description": "Controls the visual weight and emphasis of the badge. Available options:\n- `'base'` - Standard weight with moderate emphasis, suitable for most use cases.\n- `'strong'` - Increased visual weight for higher emphasis and prominence.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "showOverlay", - "value": "() => void", - "description": "A method to programmatically show the overlay." + "name": "icon", + "value": "IconProps['type'] | ''", + "description": "The icon to display inside the badge. Accepts any valid icon type or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "toggleOverlay", - "value": "() => void", - "description": "A method to programmatically toggle the visibility of the overlay." + "name": "size", + "value": "'base' | 'large' | 'large-100'", + "description": "Determines the size of the badge. Available options:\n- `'base'` - Standard size for most use cases.\n- `'large'` - Larger size for increased visibility and prominence.\n- `'large-100'` - Extra large size for maximum visibility in specific contexts.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto' | 'neutral' | 'caution'", + "description": "Determines the visual appearance and semantic meaning of the badge. Badges rely on the tone system for semantic meaning, so using custom styling might not clearly convey meaning to merchants. Available options:\n- `'auto'` - Lets the system automatically choose the appropriate tone based on context.\n- `'neutral'` - Gray styling for general status information that doesn't require emphasis.\n- `'info'` - Blue styling for informational content and neutral updates.\n- `'success'` - Green styling for positive states, completed actions, and successful operations.\n- `'caution'` - Yellow styling for situations that need attention but aren't urgent.\n- `'warning'` - Orange styling for important notices that require merchant awareness.\n- `'critical'` - Red styling for errors, failures, and urgent issues requiring immediate action.", + "defaultValue": "'auto'" } ], - "value": "export interface BaseOverlayMethods {\n /**\n * A method to programmatically show the overlay.\n *\n * @implementation This is a method to be called on the element and not a callback and should hence be camelCase\n */\n showOverlay: () => void;\n /**\n * A method to programmatically hide the overlay.\n *\n * @implementation This is a method to be called on the element and not a callback and should hence be camelCase\n */\n hideOverlay: () => void;\n /**\n * A method to programmatically toggle the visibility of the overlay.\n *\n * @implementation This is a method to be called on the element and not a callback and should hence be camelCase\n */\n toggleOverlay: () => void;\n}" + "value": "export interface BadgeProps\n extends Pick {\n /**\n * Controls the visual weight and emphasis of the badge. Available options:\n * - `'base'` - Standard weight with moderate emphasis, suitable for most use cases.\n * - `'strong'` - Increased visual weight for higher emphasis and prominence.\n *\n * @default 'base'\n */\n color: Extract;\n /**\n * The icon to display inside the badge. Accepts any valid icon type or an empty string to display no icon.\n *\n * @default ''\n */\n icon: IconProps['type'] | '';\n /**\n * Determines the size of the badge. Available options:\n * - `'base'` - Standard size for most use cases.\n * - `'large'` - Larger size for increased visibility and prominence.\n * - `'large-100'` - Extra large size for maximum visibility in specific contexts.\n *\n * @default 'base'\n */\n size: Extract;\n /**\n * Determines the visual appearance and semantic meaning of the badge. Badges rely on the tone system for semantic meaning, so using custom styling might not clearly convey meaning to merchants. Available options:\n * - `'auto'` - Lets the system automatically choose the appropriate tone based on context.\n * - `'neutral'` - Gray styling for general status information that doesn't require emphasis.\n * - `'info'` - Blue styling for informational content and neutral updates.\n * - `'success'` - Green styling for positive states, completed actions, and successful operations.\n * - `'caution'` - Yellow styling for situations that need attention but aren't urgent.\n * - `'warning'` - Orange styling for important notices that require merchant awareness.\n * - `'critical'` - Red styling for errors, failures, and urgent issues requiring immediate action.\n *\n * @default 'auto'\n */\n tone: Extract<\n BadgeProps$1['tone'],\n 'auto' | 'neutral' | 'info' | 'success' | 'caution' | 'warning' | 'critical'\n >;\n}" } }, - "FocusEventProps": { + "IconProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "FocusEventProps", + "name": "IconProps", "description": "", - "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onBlur", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", - "isOptional": true + "name": "color", + "value": "'base' | 'subdued'", + "description": "The color emphasis of the icon. Use `'base'` for the standard color intensity, or `'subdued'` for a lighter, less prominent appearance.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onFocus", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "size", + "value": "'small' | 'base'", + "description": "The size of the icon. Use `'small'` for compact layouts, or `'base'` for standard sizing.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto' | 'neutral' | 'caution'", + "description": "The color tone of the icon based on its semantic meaning. Choose from `'auto'` to let the icon inherit its context, `'neutral'` for standard icons, `'info'` for informational content, `'success'` for positive actions, `'caution'` or `'warning'` for warnings, or `'critical'` for errors.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "type", + "value": "'' | IconType | 'empty'", + "description": "The type of icon that will be displayed. You can specify an icon name from the available icon set, or use an empty string to show no icon." } ], - "value": "export interface FocusEventProps {\n /**\n * A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n onBlur?: (event: FocusEvent) => void;\n /**\n * A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n onFocus?: (event: FocusEvent) => void;\n}" + "value": "export interface IconProps\n extends Required<\n Pick\n > {\n /**\n * The type of icon that will be displayed. You can specify an icon name from the available icon set, or use an empty string to show no icon.\n */\n type: '' | IconType | 'empty';\n /**\n * The color tone of the icon based on its semantic meaning. Choose from `'auto'` to let the icon inherit its context, `'neutral'` for standard icons, `'info'` for informational content, `'success'` for positive actions, `'caution'` or `'warning'` for warnings, or `'critical'` for errors.\n *\n * @default 'auto'\n */\n tone: Extract<\n IconProps$1['tone'],\n 'auto' | 'neutral' | 'info' | 'success' | 'caution' | 'warning' | 'critical'\n >;\n /**\n * The color emphasis of the icon. Use `'base'` for the standard color intensity, or `'subdued'` for a lighter, less prominent appearance.\n *\n * @default 'base'\n */\n color: Extract;\n /**\n * The size of the icon. Use `'small'` for compact layouts, or `'base'` for standard sizing.\n *\n * @default 'base'\n */\n size: Extract;\n}" } }, - "ToggleEventProps": { + "ReactProps$_": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ToggleEventProps", - "description": "", + "name": "ReactProps$_", + "description": "The JSX props for the badge component. These properties extend `BadgeProps` with an optional `id` and `children` for rendering badge content in JSX.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onAfterToggle", - "value": "(event: ToggleEvent$1) => void", - "description": "A callback fired when the element state changes, after any toggle animations have finished.\n\n- If the element transitioned from hidden to showing, the `oldState` property will be set to `closed` and the `newState` property will be set to `open`.\n- If the element transitioned from showing to hidden, the `oldState` property will be set to `open` and the `newState` will be `closed`.\n\nLearn more about [ToggleEvent.newState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/newState) and [ToggleEvent.oldState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/oldState).", + "name": "children", + "value": "ComponentChildren", + "description": "The text content to display inside the badge. Typically a short status label like \"Fulfilled\", \"Draft\", or \"Active\".", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onToggle", - "value": "(event: ToggleEvent$1) => void", - "description": "A callback fired immediately when the element state changes, before any animations.\n\n- If the element is transitioning from hidden to showing, the `oldState` property will be set to `closed` and the `newState` property will be set to `open`.\n- If the element is transitioning from showing to hidden, then `oldState` property will be set to `open` and the `newState` will be `closed`.\n\nLearn more about the [toggle event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event), [ToggleEvent.newState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/newState), and [ToggleEvent.oldState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/oldState).", + "name": "color", + "value": "'base' | 'strong'", + "description": "Controls the visual weight and emphasis of the badge. Available options:\n- `'base'` - Standard weight with moderate emphasis, suitable for most use cases.\n- `'strong'` - Increased visual weight for higher emphasis and prominence.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "icon", + "value": "IconProps['type'] | ''", + "description": "The icon to display inside the badge. Accepts any valid icon type or an empty string to display no icon.", + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "size", + "value": "'base' | 'large' | 'large-100'", + "description": "Determines the size of the badge. Available options:\n- `'base'` - Standard size for most use cases.\n- `'large'` - Larger size for increased visibility and prominence.\n- `'large-100'` - Extra large size for maximum visibility in specific contexts.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto' | 'neutral' | 'caution'", + "description": "Determines the visual appearance and semantic meaning of the badge. Badges rely on the tone system for semantic meaning, so using custom styling might not clearly convey meaning to merchants. Available options:\n- `'auto'` - Lets the system automatically choose the appropriate tone based on context.\n- `'neutral'` - Gray styling for general status information that doesn't require emphasis.\n- `'info'` - Blue styling for informational content and neutral updates.\n- `'success'` - Green styling for positive states, completed actions, and successful operations.\n- `'caution'` - Yellow styling for situations that need attention but aren't urgent.\n- `'warning'` - Orange styling for important notices that require merchant awareness.\n- `'critical'` - Red styling for errors, failures, and urgent issues requiring immediate action.", + "defaultValue": "'auto'" } ], - "value": "export interface ToggleEventProps {\n /**\n * A callback fired when the element state changes, after any toggle animations have finished.\n *\n * - If the element transitioned from hidden to showing, the `oldState` property will be set to `closed` and the\n * `newState` property will be set to `open`.\n * - If the element transitioned from showing to hidden, the `oldState` property will be set to `open` and the\n * `newState` will be `closed`.\n *\n * Learn more about [ToggleEvent.newState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/newState) and [ToggleEvent.oldState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/oldState).\n */\n onAfterToggle?: (event: ToggleEvent$1) => void;\n /**\n * A callback fired immediately when the element state changes, before any animations.\n *\n * - If the element is transitioning from hidden to showing, the `oldState` property will be set to `closed` and the\n * `newState` property will be set to `open`.\n * - If the element is transitioning from showing to hidden, then `oldState` property will be set to `open` and the\n * `newState` will be `closed`.\n *\n * Learn more about the [toggle event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event), [ToggleEvent.newState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/newState), and [ToggleEvent.oldState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/oldState).\n */\n onToggle?: (event: ToggleEvent$1) => void;\n}" + "value": "export interface ReactProps$_\n extends Partial,\n Pick {\n /**\n * The text content to display inside the badge. Typically a short status label like \"Fulfilled\", \"Draft\", or \"Active\".\n */\n children?: ComponentChildren;\n}" } }, - "ToggleState": { + "ComponentChildren": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", - "name": "ToggleState", - "value": "'open' | 'closed'", - "description": "Represents the visibility state of a toggleable element.\n\n- `open`: The element is visible or expanded.\n- `closed`: The element is hidden or collapsed.", - "isPublicDocs": true + "name": "ComponentChildren", + "value": "preact.ComponentChildren", + "description": "" } }, - "ExtendableEvent": { + "RequiredBannerProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ExtendableEvent", - "description": "", + "syntaxKind": "TypeAliasDeclaration", + "name": "RequiredBannerProps", + "value": "Required", + "description": "All properties for the banner component marked as required.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "AT_TARGET", - "value": "2", - "description": "" + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Banner.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "bubbles", + "name": "collapsible", "value": "boolean", - "description": "The **`bubbles`** read-only property of the Event interface indicates whether the event bubbles up through the DOM tree or not.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/bubbles)" + "description": "Makes the content collapsible. A collapsible banner will conceal child elements initially, but allow the user to expand the banner to see them.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "BUBBLING_PHASE", - "value": "3", - "description": "" + "name": "dismissible", + "value": "boolean", + "description": "Determines whether the close button of the banner is present.\n\nWhen the close button is pressed, the `dismiss` event will fire, then `hidden` will be true, any animation will complete, and the `afterhide` event will fire.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "cancelable", - "value": "boolean", - "description": "The **`cancelable`** read-only property of the Event interface indicates whether the event can be canceled, and therefore prevented as if the event never happened.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelable)" + "name": "heading", + "value": "string", + "description": "The title of the banner.", + "isOptional": true, + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "cancelBubble", + "name": "hidden", "value": "boolean", - "description": "The **`cancelBubble`** property of the Event interface is deprecated.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelBubble)" + "description": "Determines whether the banner is hidden.\n\nIf this property is being set on each framework render (as in 'controlled' usage), and the banner is `dismissible`, ensure you update app state for this property when the `dismiss` event fires.\n\nIf the banner is not `dismissible`, it can still be hidden by setting this property.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "CAPTURING_PHASE", - "value": "1", - "description": "" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "composed", - "value": "boolean", - "description": "The read-only **`composed`** property of the or not the event will propagate across the shadow DOM boundary into the standard DOM.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composed)" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "composedPath", - "value": "() => EventTarget[]", - "description": "The **`composedPath()`** method of the Event interface returns the event's path which is an array of the objects on which listeners will be invoked.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composedPath)" + "name": "onAfterHide", + "value": "(event: Event) => void", + "description": "Event handler when the banner has fully hidden.\n\nThe `hidden` property will be `true` when this event fires.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "currentTarget", - "value": "EventTarget | null", - "description": "The **`currentTarget`** read-only property of the Event interface identifies the element to which the event handler has been attached.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/currentTarget)" + "name": "onDismiss", + "value": "(event: Event) => void", + "description": "Event handler when the banner is dismissed by the user.\n\nThis does not fire when setting `hidden` manually.\n\nThe `hidden` property will be `false` when this event fires.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultPrevented", - "value": "boolean", - "description": "The **`defaultPrevented`** read-only property of the Event interface returns a boolean value indicating whether or not the call to Event.preventDefault() canceled the event.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/defaultPrevented)" + "name": "primaryAction", + "value": "ComponentChildren", + "description": "The primary action to perform, provided as a button or link type element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "eventPhase", - "value": "number", - "description": "The **`eventPhase`** read-only property of the being evaluated.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/eventPhase)" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "initEvent", - "value": "(type: string, bubbles?: boolean, cancelable?: boolean) => void", - "description": "The **`Event.initEvent()`** method is used to initialize the value of an event created using Document.createEvent().", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/initEvent)" + "name": "secondaryActions", + "value": "ComponentChildren", + "description": "The secondary actions to perform, provided as button or link type elements.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "isTrusted", - "value": "boolean", - "description": "The **`isTrusted`** read-only property of the when the event was generated by the user agent (including via user actions and programmatic methods such as HTMLElement.focus()), and `false` when the event was dispatched via The only exception is the `click` event, which initializes the `isTrusted` property to `false` in user agents.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/isTrusted)" - }, + "name": "tone", + "value": "ToneKeyword", + "description": "Sets the tone of the Banner, based on the intention of the information being conveyed.\n\nThe banner is a live region and the type of status will be dictated by the Tone selected.\n\n- `critical` creates an [assertive live region](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/alert_role) that is announced by screen readers immediately.\n- `neutral`, `info`, `success`, `warning` and `caution` creates an [informative live region](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/status_role) that is announced by screen readers after the current message.", + "isOptional": true, + "defaultValue": "'auto'" + } + ] + } + }, + "ToneKeyword": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "ToneKeyword", + "value": "'auto' | 'neutral' | 'info' | 'success' | 'caution' | 'warning' | 'critical' | 'accent' | 'custom'", + "description": "Tone is a property for defining the color treatment of a component.\n\nA tone can apply a grouping of colors to a component. For example, critical may have a specific text color and background color.\n\nIn some cases, like for Banner, the tone may also affect the semantic and accessibility treatment of the component." + } + }, + "BannerProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "BannerProps", + "description": "The properties for the banner component. These properties define an important message or notification with visual styling that conveys its semantic meaning.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "NONE", - "value": "0", - "description": "" + "name": "dismissible", + "value": "boolean", + "description": "Determines whether the close button of the banner is present.\n\nWhen the close button is pressed, the `dismiss` event will fire, then `hidden` will be true, any animation will complete, and the `afterhide` event will fire.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "preventDefault", - "value": "() => void", - "description": "The **`preventDefault()`** method of the Event interface tells the user agent that if the event does not get explicitly handled, its default action should not be taken as it normally would be.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/preventDefault)" + "syntaxKind": "PropertySignature", + "name": "heading", + "value": "string", + "description": "The title of the banner.", + "isOptional": true, + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "returnValue", + "name": "hidden", "value": "boolean", - "description": "The Event property **`returnValue`** indicates whether the default action for this event has been prevented or not.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/returnValue)" + "description": "Determines whether the banner is hidden.\n\nIf this property is being set on each framework render (as in 'controlled' usage), and the banner is `dismissible`, ensure you update app state for this property when the `dismiss` event fires.\n\nIf the banner is not `dismissible`, it can still be hidden by setting this property.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "srcElement", - "value": "EventTarget | null", - "description": "The deprecated **`Event.srcElement`** is an alias for the Event.target property.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/srcElement)" - }, + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto'", + "description": "The color tone of the banner based on its semantic meaning.", + "defaultValue": "'auto'" + } + ], + "value": "export interface BannerProps\n extends Pick<\n RequiredBannerProps,\n 'heading' | 'dismissible' | 'hidden' | 'tone'\n > {\n /**\n * The color tone of the banner based on its semantic meaning.\n *\n * @default 'auto'\n */\n tone: Extract<\n RequiredBannerProps['tone'],\n 'auto' | 'critical' | 'warning' | 'success' | 'info'\n >;\n}" + } + }, + "BannerJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "BannerJSXProps", + "description": "The JSX properties for the banner component. These properties define how a banner is rendered in Preact or JSX.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "stopImmediatePropagation", - "value": "() => void", - "description": "The **`stopImmediatePropagation()`** method of the If several listeners are attached to the same element for the same event type, they are called in the order in which they were added.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopImmediatePropagation)" + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the banner.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "stopPropagation", - "value": "() => void", - "description": "The **`stopPropagation()`** method of the Event interface prevents further propagation of the current event in the capturing and bubbling phases.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopPropagation)" + "syntaxKind": "PropertySignature", + "name": "dismissible", + "value": "boolean", + "description": "Determines whether the close button of the banner is present.\n\nWhen the close button is pressed, the `dismiss` event will fire, then `hidden` will be true, any animation will complete, and the `afterhide` event will fire.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "target", - "value": "EventTarget | null", - "description": "The read-only **`target`** property of the dispatched.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/target)" + "name": "heading", + "value": "string", + "description": "The title of the banner.", + "isOptional": true, + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "timeStamp", - "value": "DOMHighResTimeStamp", - "description": "The **`timeStamp`** read-only property of the Event interface returns the time (in milliseconds) at which the event was created.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/timeStamp)" + "name": "hidden", + "value": "boolean", + "description": "Determines whether the banner is hidden.\n\nIf this property is being set on each framework render (as in 'controlled' usage), and the banner is `dismissible`, ensure you update app state for this property when the `dismiss` event fires.\n\nIf the banner is not `dismissible`, it can still be hidden by setting this property.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "type", + "name": "id", "value": "string", - "description": "The **`type`** read-only property of the Event interface returns a string containing the event's type.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/type)" + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "waitUntil", - "value": "(promise: Promise) => void", - "description": "A method that accepts a promise signaling the duration and eventual success or failure of event-related actions.\n\nCan be called multiple times to add promises to the event, but must be called synchronously during event dispatch. Cannot be called after a `setTimeout` or within a microtask.", + "name": "onAfterHide", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired after the banner finishes hiding.", "isOptional": true - } - ], - "value": "export interface ExtendableEvent extends Event {\n /**\n * A method that accepts a promise signaling the duration and eventual success or failure of event-related actions.\n *\n * Can be called multiple times to add promises to the event, but must be called synchronously during event dispatch.\n * Cannot be called after a `setTimeout` or within a microtask.\n */\n waitUntil?: (promise: Promise) => void;\n}" - } - }, - "AggregateError": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AggregateError", - "description": "", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "errors", - "value": "T[]", - "description": "An array of individual errors that have been aggregated together. Each error in this array represents a separate failure that occurred." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "message", - "value": "string", - "description": "" + "name": "onDismiss", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired when the banner is dismissed.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "name", - "value": "string", - "description": "" + "name": "secondaryActions", + "value": "ComponentChildren", + "description": "The secondary actions to display at the bottom of the banner. Only buttons with the `variant` of `'secondary'` or `'auto'` are allowed. A maximum of two `s-button` components can be provided.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "stack", - "value": "string", - "description": "", - "isOptional": true + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto'", + "description": "The color tone of the banner based on its semantic meaning.", + "defaultValue": "'auto'" } ], - "value": "export interface AggregateError extends Error {\n /**\n * An array of individual errors that have been aggregated together.\n * Each error in this array represents a separate failure that occurred.\n */\n errors: T[];\n}" + "value": "export interface BannerJSXProps\n extends Partial,\n Pick {\n /**\n * The content of the banner.\n */\n children?: ComponentChildren;\n /**\n * The secondary actions to display at the bottom of the banner. Only buttons with the `variant` of `'secondary'` or `'auto'` are allowed. A maximum of two `s-button` components can be provided.\n */\n secondaryActions?: ComponentChildren;\n /**\n * A callback that's fired when the banner is dismissed.\n */\n onDismiss?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's fired after the banner finishes hiding.\n */\n onAfterHide?: ((event: CallbackEvent) => void) | null;\n}" } }, - "AggregateErrorEvent": { + "RequiredBoxProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "AggregateErrorEvent", - "description": "", + "syntaxKind": "TypeAliasDeclaration", + "name": "RequiredBoxProps", + "value": "Required", + "description": "A version of the box properties with all fields required.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "AT_TARGET", - "value": "2", - "description": "" + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "bubbles", - "value": "boolean", - "description": "The **`bubbles`** read-only property of the Event interface indicates whether the event bubbles up through the DOM tree or not.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/bubbles)" + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "BUBBLING_PHASE", - "value": "3", - "description": "" + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "cancelable", - "value": "boolean", - "description": "The **`cancelable`** read-only property of the Event interface indicates whether the event can be canceled, and therefore prevented as if the event never happened.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelable)" + "name": "background", + "value": "BackgroundColorKeyword", + "description": "Adjust the background of the element.", + "isOptional": true, + "defaultValue": "'transparent'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "cancelBubble", - "value": "boolean", - "description": "The **`cancelBubble`** property of the Event interface is deprecated.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelBubble)" + "name": "blockSize", + "value": "MaybeResponsive", + "description": "Adjust the block size.", + "isOptional": true, + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "CAPTURING_PHASE", - "value": "1", - "description": "" + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "colno", - "value": "number", - "description": "The **`colno`** read-only property of the ErrorEvent interface returns an integer containing the column number of the script file on which the error occurred.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/colno)" + "name": "borderColor", + "value": "ColorKeyword | ''", + "description": "Set the color of the border.\n\nIf set, it takes precedence over the `border` property's color.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "composed", - "value": "boolean", - "description": "The read-only **`composed`** property of the or not the event will propagate across the shadow DOM boundary into the standard DOM.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composed)" + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Set the radius of the border.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `start-start start-end end-end end-start`\n- 3 values: `start-start (start-end & end-start) start-end`\n- 2 values: `(start-start & end-end) (start-end & end-start)`\n\nFor example:\n- `small-100` means start-start, start-end, end-end and end-start border radii are `small-100`.\n- `small-100 none` means start-start and end-end border radii are `small-100`, start-end and end-start border radii are `none`.\n- `small-100 none large-100` means start-start border radius is `small-100`, start-end border radius is `none`, end-end border radius is `large-100` and end-start border radius is `none`.\n- `small-100 none large-100 small-100` means start-start border radius is `small-100`, start-end border radius is `none`, end-end border radius is `large-100` and end-start border radius is `small-100`.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "composedPath", - "value": "() => EventTarget[]", - "description": "The **`composedPath()`** method of the Event interface returns the event's path which is an array of the objects on which listeners will be invoked.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composedPath)" + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "MaybeAllValuesShorthandProperty | ''", + "description": "Set the style of the border.\n\nIf set, it takes precedence over the `border` property's style.\n\nLike CSS, up to 4 values can be specified.\n\nIf one value is specified, it applies to all sides.\n\nIf two values are specified, they apply to the block sides and inline sides respectively.\n\nIf three values are specified, they apply to the block-start, both inline sides, and block-end respectively.\n\nIf four values are specified, they apply to the block-start, block-end, inline-start, and inline-end sides respectively.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "currentTarget", - "value": "EventTarget | null", - "description": "The **`currentTarget`** read-only property of the Event interface identifies the element to which the event handler has been attached.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/currentTarget)" + "name": "borderWidth", + "value": "MaybeAllValuesShorthandProperty | ''", + "description": "Set the width of the border.\n\nIf set, it takes precedence over the `border` property's width.\n\nLike CSS, up to 4 values can be specified.\n\nIf one value is specified, it applies to all sides.\n\nIf two values are specified, they apply to the block sides and inline sides respectively.\n\nIf three values are specified, they apply to the block-start, both inline sides, and block-end respectively.\n\nIf four values are specified, they apply to the block-start, block-end, inline-start, and inline-end sides respectively.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultPrevented", - "value": "boolean", - "description": "The **`defaultPrevented`** read-only property of the Event interface returns a boolean value indicating whether or not the call to Event.preventDefault() canceled the event.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/defaultPrevented)" + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Box.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", - "value": "AggregateError", - "description": "The aggregated error object containing multiple individual errors. Access the `errors` property to retrieve the array of individual error instances." + "name": "display", + "value": "MaybeResponsive<'auto' | 'none'>", + "description": "Sets the outer display type of the component. The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "isOptional": true, + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "eventPhase", - "value": "number", - "description": "The **`eventPhase`** read-only property of the being evaluated.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/eventPhase)" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "filename", - "value": "string", - "description": "The **`filename`** read-only property of the ErrorEvent interface returns a string containing the name of the script file in which the error occurred.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/filename)" + "name": "inlineSize", + "value": "MaybeResponsive", + "description": "Adjust the inline size.", + "isOptional": true, + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "initEvent", - "value": "(type: string, bubbles?: boolean, cancelable?: boolean) => void", - "description": "The **`Event.initEvent()`** method is used to initialize the value of an event created using Document.createEvent().", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/initEvent)" + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "MaybeResponsive", + "description": "Adjust the maximum block size.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "isTrusted", - "value": "boolean", - "description": "The **`isTrusted`** read-only property of the when the event was generated by the user agent (including via user actions and programmatic methods such as HTMLElement.focus()), and `false` when the event was dispatched via The only exception is the `click` event, which initializes the `isTrusted` property to `false` in user agents.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/isTrusted)" + "name": "maxInlineSize", + "value": "MaybeResponsive", + "description": "Adjust the maximum inline size.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "lineno", - "value": "number", - "description": "The **`lineno`** read-only property of the ErrorEvent interface returns an integer containing the line number of the script file on which the error occurred.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/lineno)" + "name": "minBlockSize", + "value": "MaybeResponsive", + "description": "Adjust the minimum block size.", + "isOptional": true, + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "message", - "value": "string", - "description": "The **`message`** read-only property of the ErrorEvent interface returns a string containing a human-readable error message describing the problem.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/message)" + "name": "minInlineSize", + "value": "MaybeResponsive", + "description": "Adjust the minimum inline size.", + "isOptional": true, + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "NONE", - "value": "0", - "description": "" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "preventDefault", - "value": "() => void", - "description": "The **`preventDefault()`** method of the Event interface tells the user agent that if the event does not get explicitly handled, its default action should not be taken as it normally would be.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/preventDefault)" + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "returnValue", - "value": "boolean", - "description": "The Event property **`returnValue`** indicates whether the default action for this event has been prevented or not.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/returnValue)" + "name": "padding", + "value": "MaybeResponsive>", + "description": "Adjust the padding of all edges.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `block-start inline-end block-end inline-start`\n- 3 values: `block-start inline block-end`\n- 2 values: `block inline`\n\nFor example:\n- `large` means block-start, inline-end, block-end and inline-start paddings are `large`.\n- `large none` means block-start and block-end paddings are `large`, inline-start and inline-end paddings are `none`.\n- `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`.\n- `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`.\n\nA padding value of `auto` will use the default padding for the closest container that has had its usual padding removed.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "srcElement", - "value": "EventTarget | null", - "description": "The deprecated **`Event.srcElement`** is an alias for the Event.target property.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/srcElement)" + "name": "paddingBlock", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the block-padding.\n\n- `large none` means block-start padding is `large`, block-end padding is `none`.\n\nThis overrides the block value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "stopImmediatePropagation", - "value": "() => void", - "description": "The **`stopImmediatePropagation()`** method of the If several listeners are attached to the same element for the same event type, they are called in the order in which they were added.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopImmediatePropagation)" + "syntaxKind": "PropertySignature", + "name": "paddingBlockEnd", + "value": "MaybeResponsive", + "description": "Adjust the block-end padding.\n\nThis overrides the block-end value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "stopPropagation", - "value": "() => void", - "description": "The **`stopPropagation()`** method of the Event interface prevents further propagation of the current event in the capturing and bubbling phases.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopPropagation)" + "syntaxKind": "PropertySignature", + "name": "paddingBlockStart", + "value": "MaybeResponsive", + "description": "Adjust the block-start padding.\n\nThis overrides the block-start value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "target", - "value": "EventTarget | null", - "description": "The read-only **`target`** property of the dispatched.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/target)" + "name": "paddingInline", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the inline padding.\n\n- `large none` means inline-start padding is `large`, inline-end padding is `none`.\n\nThis overrides the inline value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "timeStamp", - "value": "DOMHighResTimeStamp", - "description": "The **`timeStamp`** read-only property of the Event interface returns the time (in milliseconds) at which the event was created.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/timeStamp)" + "name": "paddingInlineEnd", + "value": "MaybeResponsive", + "description": "Adjust the inline-end padding.\n\nThis overrides the inline-end value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "type", - "value": "string", - "description": "The **`type`** read-only property of the Event interface returns a string containing the event's type.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/type)" + "name": "paddingInlineStart", + "value": "MaybeResponsive", + "description": "Adjust the inline-start padding.\n\nThis overrides the inline-start value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" } - ], - "value": "export interface AggregateErrorEvent extends ErrorEvent {\n /**\n * The aggregated error object containing multiple individual errors.\n * Access the `errors` property to retrieve the array of individual error instances.\n */\n error: AggregateError;\n}" - } - }, - "ToneKeyword": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ToneKeyword", - "value": "'auto' | 'neutral' | 'info' | 'success' | 'caution' | 'warning' | 'critical' | 'accent' | 'custom'", - "description": "Defines the semantic color treatment of a component to convey specific intent or status.\n\nTones apply coordinated color schemes (text, background, icons) across the component. Some components, like banner, also use tone to determine accessibility attributes and screen reader announcements.\n\n- `auto`: Automatically determined based on context.\n- `neutral`: General-purpose information without specific sentiment.\n- `info`: Informational content that provides helpful details or guidance.\n- `success`: Positive outcomes, successful operations, or confirmations.\n- `caution`: Warnings about potential issues that require attention but aren't critical.\n- `warning`: Similar to caution, indicates something that needs user awareness.\n- `critical`: Errors, failures, or urgent issues that require immediate attention.\n- `accent`: Highlighted or emphasized content that doesn't fit other semantic tones.\n- `custom`: Custom color treatment defined by your theme or implementation.", - "isPublicDocs": true - } - }, - "IconType": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "IconType", - "value": "'replace' | 'search' | 'split' | 'link' | 'edit' | 'info' | 'incomplete' | 'complete' | 'product' | 'variant' | 'collection' | 'select' | 'color' | 'money' | 'order' | 'code' | 'adjust' | 'affiliate' | 'airplane' | 'alert-bubble' | 'alert-circle' | 'alert-diamond' | 'alert-location' | 'alert-octagon' | 'alert-octagon-filled' | 'alert-triangle' | 'alert-triangle-filled' | 'app-extension' | 'apps' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-down-right' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'arrow-up-right' | 'arrows-in-horizontal' | 'arrows-out-horizontal' | 'asterisk' | 'attachment' | 'automation' | 'backspace' | 'bag' | 'bank' | 'barcode' | 'battery-low' | 'bill' | 'blank' | 'blog' | 'bolt' | 'bolt-filled' | 'book' | 'book-open' | 'bug' | 'bullet' | 'business-entity' | 'button' | 'button-press' | 'calculator' | 'calendar' | 'calendar-check' | 'calendar-compare' | 'calendar-list' | 'calendar-time' | 'camera' | 'camera-flip' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'cart' | 'cart-abandoned' | 'cart-discount' | 'cart-down' | 'cart-filled' | 'cart-sale' | 'cart-send' | 'cart-up' | 'cash-dollar' | 'cash-euro' | 'cash-pound' | 'cash-rupee' | 'cash-yen' | 'catalog-product' | 'categories' | 'channels' | 'chart-cohort' | 'chart-donut' | 'chart-funnel' | 'chart-histogram-first' | 'chart-histogram-first-last' | 'chart-histogram-flat' | 'chart-histogram-full' | 'chart-histogram-growth' | 'chart-histogram-last' | 'chart-histogram-second-last' | 'chart-horizontal' | 'chart-line' | 'chart-popular' | 'chart-stacked' | 'chart-vertical' | 'chat' | 'chat-new' | 'chat-referral' | 'check' | 'check-circle' | 'check-circle-filled' | 'checkbox' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-right' | 'chevron-right-circle' | 'chevron-up' | 'chevron-up-circle' | 'circle' | 'circle-dashed' | 'clipboard' | 'clipboard-check' | 'clipboard-checklist' | 'clock' | 'clock-list' | 'clock-revert' | 'code-add' | 'collection-featured' | 'collection-list' | 'collection-reference' | 'color-none' | 'compass' | 'compose' | 'confetti' | 'connect' | 'content' | 'contract' | 'corner-pill' | 'corner-round' | 'corner-square' | 'credit-card' | 'credit-card-cancel' | 'credit-card-percent' | 'credit-card-reader' | 'credit-card-reader-chip' | 'credit-card-reader-tap' | 'credit-card-secure' | 'credit-card-tap-chip' | 'crop' | 'currency-convert' | 'cursor' | 'cursor-banner' | 'cursor-option' | 'data-presentation' | 'data-table' | 'database' | 'database-add' | 'database-connect' | 'delete' | 'delivered' | 'delivery' | 'desktop' | 'disabled' | 'disabled-filled' | 'discount' | 'discount-add' | 'discount-automatic' | 'discount-code' | 'discount-remove' | 'dns-settings' | 'dock-floating' | 'dock-side' | 'domain' | 'domain-landing-page' | 'domain-new' | 'domain-redirect' | 'download' | 'drag-drop' | 'drag-handle' | 'drawer' | 'duplicate' | 'email' | 'email-follow-up' | 'email-newsletter' | 'empty' | 'enabled' | 'enter' | 'envelope' | 'envelope-soft-pack' | 'eraser' | 'exchange' | 'exit' | 'export' | 'external' | 'eye-check-mark' | 'eye-dropper' | 'eye-dropper-list' | 'eye-first' | 'eyeglasses' | 'fav' | 'favicon' | 'file' | 'file-list' | 'filter' | 'filter-active' | 'flag' | 'flip-horizontal' | 'flip-vertical' | 'flower' | 'folder' | 'folder-add' | 'folder-down' | 'folder-remove' | 'folder-up' | 'food' | 'foreground' | 'forklift' | 'forms' | 'games' | 'gauge' | 'geolocation' | 'gift' | 'gift-card' | 'git-branch' | 'git-commit' | 'git-repository' | 'globe' | 'globe-asia' | 'globe-europe' | 'globe-lines' | 'globe-list' | 'graduation-hat' | 'grid' | 'hashtag' | 'hashtag-decimal' | 'hashtag-list' | 'heart' | 'hide' | 'hide-filled' | 'home' | 'home-filled' | 'icons' | 'identity-card' | 'image' | 'image-add' | 'image-alt' | 'image-explore' | 'image-magic' | 'image-none' | 'image-with-text-overlay' | 'images' | 'import' | 'in-progress' | 'incentive' | 'incoming' | 'info-filled' | 'inheritance' | 'inventory' | 'inventory-edit' | 'inventory-list' | 'inventory-transfer' | 'inventory-updated' | 'iq' | 'key' | 'keyboard' | 'keyboard-filled' | 'keyboard-hide' | 'keypad' | 'label-printer' | 'language' | 'language-translate' | 'layout-block' | 'layout-buy-button' | 'layout-buy-button-horizontal' | 'layout-buy-button-vertical' | 'layout-column-1' | 'layout-columns-2' | 'layout-columns-3' | 'layout-footer' | 'layout-header' | 'layout-logo-block' | 'layout-popup' | 'layout-rows-2' | 'layout-section' | 'layout-sidebar-left' | 'layout-sidebar-right' | 'lightbulb' | 'link-list' | 'list-bulleted' | 'list-bulleted-filled' | 'list-numbered' | 'live' | 'live-critical' | 'live-none' | 'location' | 'location-none' | 'lock' | 'map' | 'markets' | 'markets-euro' | 'markets-rupee' | 'markets-yen' | 'maximize' | 'measurement-size' | 'measurement-size-list' | 'measurement-volume' | 'measurement-volume-list' | 'measurement-weight' | 'measurement-weight-list' | 'media-receiver' | 'megaphone' | 'mention' | 'menu' | 'menu-filled' | 'menu-horizontal' | 'menu-vertical' | 'merge' | 'metafields' | 'metaobject' | 'metaobject-list' | 'metaobject-reference' | 'microphone' | 'microphone-muted' | 'minimize' | 'minus' | 'minus-circle' | 'mobile' | 'money-none' | 'money-split' | 'moon' | 'nature' | 'note' | 'note-add' | 'notification' | 'number-one' | 'order-batches' | 'order-draft' | 'order-filled' | 'order-first' | 'order-fulfilled' | 'order-repeat' | 'order-unfulfilled' | 'orders-status' | 'organization' | 'outdent' | 'outgoing' | 'package' | 'package-cancel' | 'package-fulfilled' | 'package-on-hold' | 'package-reassign' | 'package-returned' | 'page' | 'page-add' | 'page-attachment' | 'page-clock' | 'page-down' | 'page-heart' | 'page-list' | 'page-reference' | 'page-remove' | 'page-report' | 'page-up' | 'pagination-end' | 'pagination-start' | 'paint-brush-flat' | 'paint-brush-round' | 'paper-check' | 'partially-complete' | 'passkey' | 'paste' | 'pause-circle' | 'payment' | 'payment-capture' | 'payout' | 'payout-dollar' | 'payout-euro' | 'payout-pound' | 'payout-rupee' | 'payout-yen' | 'person' | 'person-add' | 'person-exit' | 'person-filled' | 'person-list' | 'person-lock' | 'person-remove' | 'person-segment' | 'personalized-text' | 'phablet' | 'phone' | 'phone-down' | 'phone-down-filled' | 'phone-in' | 'phone-out' | 'pin' | 'pin-remove' | 'plan' | 'play' | 'play-circle' | 'plus' | 'plus-circle' | 'plus-circle-down' | 'plus-circle-filled' | 'plus-circle-up' | 'point-of-sale' | 'point-of-sale-register' | 'price-list' | 'print' | 'product-add' | 'product-cost' | 'product-filled' | 'product-list' | 'product-reference' | 'product-remove' | 'product-return' | 'product-unavailable' | 'profile' | 'profile-filled' | 'question-circle' | 'question-circle-filled' | 'radio-control' | 'receipt' | 'receipt-dollar' | 'receipt-euro' | 'receipt-folded' | 'receipt-paid' | 'receipt-pound' | 'receipt-refund' | 'receipt-rupee' | 'receipt-yen' | 'receivables' | 'redo' | 'referral-code' | 'refresh' | 'remove-background' | 'reorder' | 'replay' | 'reset' | 'return' | 'reward' | 'rocket' | 'rotate-left' | 'rotate-right' | 'sandbox' | 'save' | 'savings' | 'scan-qr-code' | 'search-add' | 'search-list' | 'search-recent' | 'search-resource' | 'send' | 'settings' | 'share' | 'shield-check-mark' | 'shield-none' | 'shield-pending' | 'shield-person' | 'shipping-label' | 'shipping-label-cancel' | 'shopcodes' | 'slideshow' | 'smiley-happy' | 'smiley-joy' | 'smiley-neutral' | 'smiley-sad' | 'social-ad' | 'social-post' | 'sort' | 'sort-ascending' | 'sort-descending' | 'sound' | 'sports' | 'star' | 'star-circle' | 'star-filled' | 'star-half' | 'star-list' | 'status' | 'status-active' | 'stop-circle' | 'store' | 'store-import' | 'store-managed' | 'store-online' | 'sun' | 'table' | 'table-masonry' | 'tablet' | 'target' | 'tax' | 'team' | 'text' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'text-block' | 'text-bold' | 'text-color' | 'text-font' | 'text-font-list' | 'text-grammar' | 'text-in-columns' | 'text-in-rows' | 'text-indent' | 'text-indent-remove' | 'text-italic' | 'text-quote' | 'text-title' | 'text-underline' | 'text-with-image' | 'theme' | 'theme-edit' | 'theme-store' | 'theme-template' | 'three-d-environment' | 'thumbs-down' | 'thumbs-up' | 'tip-jar' | 'toggle-off' | 'toggle-on' | 'transaction' | 'transaction-fee-add' | 'transaction-fee-dollar' | 'transaction-fee-euro' | 'transaction-fee-pound' | 'transaction-fee-rupee' | 'transaction-fee-yen' | 'transfer' | 'transfer-in' | 'transfer-internal' | 'transfer-out' | 'truck' | 'undo' | 'unknown-device' | 'unlock' | 'upload' | 'variant-list' | 'video' | 'video-list' | 'view' | 'viewport-narrow' | 'viewport-short' | 'viewport-tall' | 'viewport-wide' | 'wallet' | 'wand' | 'watch' | 'wifi' | 'work' | 'work-list' | 'wrench' | 'x' | 'x-circle' | 'x-circle-filled'", - "description": "Represents the available icon names that can be used in icon components. This is derived from the complete list of supported icons in the design system.", - "isPublicDocs": true - } - }, - "ExtractStrict": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ExtractStrict", - "value": "", - "description": "A type-safe version of TypeScript's `Extract` utility that constrains the second type parameter to be assignable to the first. This provides compile-time validation that you're only extracting types that actually exist within the union, catching potential errors earlier in development.", - "isPublicDocs": true + ] } }, - "optionalSpace": { + "ResponsiveBoxProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", - "name": "optionalSpace", - "value": "'' | ' '", - "description": "A utility type representing an optional space character for use in string literal type composition. Allows flexible formatting of compound values where spacing is a matter of preference rather than semantic difference.", - "isPublicDocs": true - } - }, - "DisplayProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "DisplayProps", - "description": "", + "name": "ResponsiveBoxProps", + "value": "MakeResponsivePick<\n RequiredBoxProps,\n | 'padding'\n | 'paddingBlock'\n | 'paddingBlockStart'\n | 'paddingBlockEnd'\n | 'paddingInline'\n | 'paddingInlineStart'\n | 'paddingInlineEnd'\n | 'display'\n>", + "description": "The box properties that support responsive values through container queries.", "isPublicDocs": true, "members": [ { @@ -13626,89 +15225,81 @@ "syntaxKind": "PropertySignature", "name": "display", "value": "MaybeResponsive<'auto' | 'none'>", - "description": "The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n\nLearn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).", + "description": "Sets the outer display type of the component. The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", "isOptional": true, "defaultValue": "'auto'" - } - ], - "value": "export interface DisplayProps {\n /**\n * The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n *\n * - `auto`: the component’s initial value. The actual value depends on the component and context.\n * - `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n *\n * Learn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).\n *\n * @default 'auto'\n */\n display?: MaybeResponsive<'auto' | 'none'>;\n}" - } - }, - "AccessibilityRoleProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AccessibilityRoleProps", - "description": "", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityRole", - "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "name": "padding", + "value": "MaybeResponsive>", + "description": "Adjust the padding of all edges.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `block-start inline-end block-end inline-start`\n- 3 values: `block-start inline block-end`\n- 2 values: `block inline`\n\nFor example:\n- `large` means block-start, inline-end, block-end and inline-start paddings are `large`.\n- `large none` means block-start and block-end paddings are `large`, inline-start and inline-end paddings are `none`.\n- `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`.\n- `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`.\n\nA padding value of `auto` will use the default padding for the closest container that has had its usual padding removed.", "isOptional": true, - "defaultValue": "'generic'" - } - ], - "value": "export interface AccessibilityRoleProps {\n /**\n * The semantic meaning of the component’s content. When set,\n * the role will be used by assistive technologies to help users\n * navigate the page.\n *\n * @implementation Although, in HTML hosts, this property changes the element used,\n * changing this property must not impact the visual styling of inside or outside of the box.\n *\n * @default 'generic'\n */\n accessibilityRole?: AccessibilityRole;\n}" - } - }, - "LabelAccessibilityVisibilityProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "LabelAccessibilityVisibilityProps", - "description": "", - "isPublicDocs": true, - "members": [ + "defaultValue": "'none'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "labelAccessibilityVisibility", - "value": "'visible' | 'exclusive'", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "name": "paddingBlock", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the block-padding.\n\n- `large none` means block-start padding is `large`, block-end padding is `none`.\n\nThis overrides the block value of `padding`.", "isOptional": true, - "defaultValue": "'visible'" - } - ], - "value": "export interface LabelAccessibilityVisibilityProps {\n /**\n * Controls whether the label is visible to all users or only to screen readers.\n *\n * - `visible`: The label is shown to everyone (default).\n * - `exclusive`: The label is visually hidden but still announced by screen readers.\n *\n * Use `exclusive` when the surrounding context makes the label redundant visually,\n * but screen reader users still need it for clarity.\n *\n * @default 'visible'\n */\n labelAccessibilityVisibility?: ExtractStrict<\n AccessibilityVisibilityProps['accessibilityVisibility'],\n 'visible' | 'exclusive'\n >;\n}" - } - }, - "BorderRadiusKeyword": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "BorderRadiusKeyword", - "value": "SizeKeyword | 'max' | 'none'", - "description": "Defines the radius of rounded corners, using the standard size scale, `max` for fully rounded, or `none` for sharp corners.", - "isPublicDocs": true - } - }, - "OverflowProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "OverflowProps", - "description": "", - "isPublicDocs": true, - "members": [ + "defaultValue": "'' - meaning no override" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "overflow", - "value": "'hidden' | 'visible'", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "name": "paddingBlockEnd", + "value": "MaybeResponsive", + "description": "Adjust the block-end padding.\n\nThis overrides the block-end value of `paddingBlock`.", "isOptional": true, - "defaultValue": "'visible'" + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockStart", + "value": "MaybeResponsive", + "description": "Adjust the block-start padding.\n\nThis overrides the block-start value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInline", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the inline padding.\n\n- `large none` means inline-start padding is `large`, inline-end padding is `none`.\n\nThis overrides the inline value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineEnd", + "value": "MaybeResponsive", + "description": "Adjust the inline-end padding.\n\nThis overrides the inline-end value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineStart", + "value": "MaybeResponsive", + "description": "Adjust the inline-start padding.\n\nThis overrides the inline-start value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" } - ], - "value": "export interface OverflowProps {\n /**\n * The overflow behavior of the element.\n *\n * - `visible`: the content that extends beyond the element’s container is visible.\n * - `hidden`: clips the content when it is larger than the element’s container.\n * The element will not be scrollable and the users will not be able\n * to access the clipped content by dragging or using a scroll wheel on a mouse.\n *\n * @default 'visible'\n */\n overflow?: 'hidden' | 'visible';\n}" + ] } }, - "BaseBoxProps": { + "BoxProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseBoxProps", - "description": "", + "name": "BoxProps", + "description": "The properties for the box component. A box provides control over layout, spacing, sizing, borders, and background styling for its content.", "isPublicDocs": true, "members": [ { @@ -13716,15 +15307,24 @@ "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "accessibilityVisibility", "value": "'visible' | 'hidden' | 'exclusive'", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "isOptional": true, "defaultValue": "'visible'" }, @@ -13732,18 +15332,16 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "background", - "value": "BackgroundColorKeyword", - "description": "The background color of the element. Use `transparent` for no background, `subdued` for a subtle background, `base` for standard background, or `strong` for a prominent background.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isOptional": true, + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blockSize", - "value": "MaybeResponsive", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about the [block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -13751,7 +15349,7 @@ "syntaxKind": "PropertySignature", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.\n\nAccepts a size value, optionally followed by a color, optionally followed by a style. Omitted values use defaults: color defaults to `base`, style defaults to `auto`.\n\nIndividual properties (`borderWidth`, `borderStyle`, `borderColor`) can override values set here.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "isOptional": true, "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ @@ -13771,98 +15369,80 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "borderColor", - "value": "ColorKeyword | ''", - "description": "The color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", - "isOptional": true, + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- One value: applies to all corners\n- Two values: applies to start corners (top-left & bottom-right) and end corners (top-right & bottom-left) respectively\n- Three values: applies to start-start (top-left), end corners (top-right & bottom-left), and end-end (bottom-right) respectively\n- Four values: applies to start-start (top-left), start-end (top-right), end-end (bottom-right), and end-start (bottom-left) respectively\n\nExamples:\n- `small-100`: All corners have `small-100` radius\n- `small-100 none`: Top-left and bottom-right are `small-100`, top-right and bottom-left are `none`\n- `small-100 none large-100`: Top-left is `small-100`, top-right and bottom-left are `none`, bottom-right is `large-100`\n- `small-100 none large-100 base`: Each corner has its specified radius value", - "isOptional": true, + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "borderStyle", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted.\n\nWhen set, this overrides the style value specified in the `border` property.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different styles per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", - "isOptional": true, + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "borderWidth", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", - "isOptional": true, + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The content displayed within the box component, which serves as a flexible container for organizing and styling other components.", - "isOptional": true - }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "display", - "value": "MaybeResponsive<'auto' | 'none'>", - "description": "The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n\nLearn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).", - "isOptional": true, + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "inlineSize", - "value": "MaybeResponsive", - "description": "The horizontal size of the element in standard layouts (width in left-to-right or right-to-left writing modes).\n\nInline size adjusts based on the writing direction: in horizontal layouts, it controls the width; in vertical layouts, it controls the height. This ensures consistent behavior across different text directions.\n\nLearn more about the [inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "maxBlockSize", - "value": "MaybeResponsive", - "description": "The maximum vertical size of the element in standard layouts (max-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the block axis.\n\nLearn more about the [max-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", - "isOptional": true, + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "maxInlineSize", - "value": "MaybeResponsive", - "description": "The maximum horizontal size of the element in standard layouts (max-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the inline axis.\n\nLearn more about the [max-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", - "isOptional": true, + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "minBlockSize", - "value": "MaybeResponsive", - "description": "The minimum vertical size of the element in standard layouts (min-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the block axis.\n\nLearn more about the [min-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", - "isOptional": true, + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "minInlineSize", - "value": "MaybeResponsive", - "description": "The minimum horizontal size of the element in standard layouts (min-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the inline axis.\n\nLearn more about the [min-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", - "isOptional": true, + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -13870,7 +15450,7 @@ "syntaxKind": "PropertySignature", "name": "overflow", "value": "'hidden' | 'visible'", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "isOptional": true, "defaultValue": "'visible'" }, @@ -13879,73 +15459,66 @@ "syntaxKind": "PropertySignature", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding.", - "isOptional": true, + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingBlock", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingBlockEnd", - "value": "MaybeResponsive", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingBlockStart", - "value": "MaybeResponsive", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingInline", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingInlineEnd", - "value": "MaybeResponsive", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingInlineStart", - "value": "MaybeResponsive", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" } ], - "value": "export interface BaseBoxProps\n extends AccessibilityVisibilityProps,\n BackgroundProps,\n DisplayProps,\n SizingProps,\n PaddingProps,\n BorderProps,\n OverflowProps {\n /**\n * The content displayed within the box component, which serves as a flexible container for organizing and styling other components.\n */\n children?: ComponentChildren;\n /**\n * A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.\n */\n accessibilityLabel?: string;\n}" + "value": "export interface BoxProps\n extends Pick<\n RequiredBoxProps,\n | 'accessibilityLabel'\n | 'accessibilityRole'\n | 'accessibilityVisibility'\n | 'background'\n | 'blockSize'\n | 'border'\n | 'borderColor'\n | 'borderRadius'\n | 'borderStyle'\n | 'borderWidth'\n | 'inlineSize'\n | 'maxBlockSize'\n | 'maxInlineSize'\n | 'minBlockSize'\n | 'minInlineSize'\n | 'overflow'\n > {\n /**\n * The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.\n *\n * @default 'transparent'\n */\n background: Extract<\n RequiredBoxProps['background'],\n 'transparent' | 'base' | 'subdued' | 'strong'\n >;\n /**\n * Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n *\n * - `small`: Thin border for subtle definition.\n * - `small-100`: Extra thin border for minimal emphasis.\n * - `base`: Standard border width.\n * - `large`: Thick border for strong emphasis.\n * - `large-100`: Extra thick border for maximum prominence.\n * - `none`: No border.\n *\n * Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.\n *\n * @default '' - meaning no override\n */\n borderWidth:\n | MaybeAllValuesShorthandProperty<\n Extract<\n RequiredBoxProps['borderWidth'],\n 'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'none'\n >\n >\n | Extract;\n /**\n * Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n *\n * When set, this overrides the style value specified in the `border` property.\n * Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides,\n * two values apply to block and inline sides, and so on.\n *\n * @default '' - meaning no override\n */\n borderStyle:\n | MaybeAllValuesShorthandProperty\n | Extract;\n /**\n * Controls the color of the border using the design system's color scale.\n *\n * When set, this overrides the color value specified in the `border` property.\n * Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.\n *\n * @default '' - meaning no override\n */\n borderColor: Extract<\n RequiredBoxProps['borderColor'],\n 'subdued' | 'base' | 'strong' | ''\n >;\n /**\n * Controls the roundedness of the element's corners using the design system's radius scale.\n *\n * Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements.\n * One value applies to all corners, two values apply to opposite corners, and so on.\n *\n * @default 'none'\n */\n borderRadius: MaybeAllValuesShorthandProperty;\n /**\n * The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.\n *\n * @default 'none'\n */\n padding: ResponsiveBoxProps['padding'];\n /**\n * The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.\n *\n * @default '' - meaning no override\n */\n paddingBlock: ResponsiveBoxProps['paddingBlock'];\n /**\n * The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.\n *\n * @default '' - meaning no override\n */\n paddingBlockStart: ResponsiveBoxProps['paddingBlockStart'];\n /**\n * The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.\n *\n * @default '' - meaning no override\n */\n paddingBlockEnd: ResponsiveBoxProps['paddingBlockEnd'];\n /**\n * The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.\n *\n * @default '' - meaning no override\n */\n paddingInline: ResponsiveBoxProps['paddingInline'];\n /**\n * The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.\n *\n * @default '' - meaning no override\n */\n paddingInlineStart: ResponsiveBoxProps['paddingInlineStart'];\n /**\n * The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.\n *\n * @default '' - meaning no override\n */\n paddingInlineEnd: ResponsiveBoxProps['paddingInlineEnd'];\n /**\n * The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.\n *\n * @default 'auto'\n */\n display: ResponsiveBoxProps['display'];\n /**\n * The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n *\n * Block size adjusts based on the writing direction: in horizontal layouts, it controls the height;\n * in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n *\n * Learn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n *\n * @default 'auto'\n */\n blockSize: SizeUnitsOrAuto;\n /**\n * The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).\n *\n * @default '0'\n */\n minBlockSize: SizeUnits;\n /**\n * The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).\n *\n * @default 'none'\n */\n maxBlockSize: SizeUnitsOrNone;\n /**\n * The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).\n *\n * @default 'auto'\n */\n inlineSize: SizeUnitsOrAuto;\n /**\n * The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).\n *\n * @default '0'\n */\n minInlineSize: SizeUnits;\n /**\n * The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).\n *\n * @default 'none'\n */\n maxInlineSize: SizeUnitsOrNone;\n}" } }, - "BaseBoxPropsWithRole": { + "BoxJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseBoxPropsWithRole", - "description": "", + "name": "BoxJSXProps", + "description": "The properties for the box component when it's used in JSX.", "isPublicDocs": true, "members": [ { @@ -13953,7 +15526,7 @@ "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { @@ -13961,7 +15534,7 @@ "syntaxKind": "PropertySignature", "name": "accessibilityRole", "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", "isOptional": true, "defaultValue": "'generic'" }, @@ -13970,7 +15543,7 @@ "syntaxKind": "PropertySignature", "name": "accessibilityVisibility", "value": "'visible' | 'hidden' | 'exclusive'", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "isOptional": true, "defaultValue": "'visible'" }, @@ -13978,18 +15551,16 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "background", - "value": "BackgroundColorKeyword", - "description": "The background color of the element. Use `transparent` for no background, `subdued` for a subtle background, `base` for standard background, or `strong` for a prominent background.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isOptional": true, + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", "defaultValue": "'transparent'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "blockSize", - "value": "MaybeResponsive", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about the [block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", "defaultValue": "'auto'" }, { @@ -13997,7 +15568,7 @@ "syntaxKind": "PropertySignature", "name": "border", "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.\n\nAccepts a size value, optionally followed by a color, optionally followed by a style. Omitted values use defaults: color defaults to `base`, style defaults to `auto`.\n\nIndividual properties (`borderWidth`, `borderStyle`, `borderColor`) can override values set here.", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "isOptional": true, "defaultValue": "'none' - equivalent to `none base auto`.", "examples": [ @@ -14017,36 +15588,32 @@ "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "borderColor", - "value": "ColorKeyword | ''", - "description": "The color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", - "isOptional": true, + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- One value: applies to all corners\n- Two values: applies to start corners (top-left & bottom-right) and end corners (top-right & bottom-left) respectively\n- Three values: applies to start-start (top-left), end corners (top-right & bottom-left), and end-end (bottom-right) respectively\n- Four values: applies to start-start (top-left), start-end (top-right), end-end (bottom-right), and end-start (bottom-left) respectively\n\nExamples:\n- `small-100`: All corners have `small-100` radius\n- `small-100 none`: Top-left and bottom-right are `small-100`, top-right and bottom-left are `none`\n- `small-100 none large-100`: Top-left is `small-100`, top-right and bottom-left are `none`, bottom-right is `large-100`\n- `small-100 none large-100 base`: Each corner has its specified radius value", - "isOptional": true, + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "borderStyle", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted.\n\nWhen set, this overrides the style value specified in the `border` property.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different styles per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", - "isOptional": true, + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "borderWidth", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", - "isOptional": true, + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", "defaultValue": "'' - meaning no override" }, { @@ -14054,61 +15621,63 @@ "syntaxKind": "PropertySignature", "name": "children", "value": "ComponentChildren", - "description": "The content displayed within the box component, which serves as a flexible container for organizing and styling other components.", + "description": "The child elements to render inside the box.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "display", - "value": "MaybeResponsive<'auto' | 'none'>", - "description": "The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n\nLearn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).", - "isOptional": true, + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", "defaultValue": "'auto'" }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "inlineSize", - "value": "MaybeResponsive", - "description": "The horizontal size of the element in standard layouts (width in left-to-right or right-to-left writing modes).\n\nInline size adjusts based on the writing direction: in horizontal layouts, it controls the width; in vertical layouts, it controls the height. This ensures consistent behavior across different text directions.\n\nLearn more about the [inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "maxBlockSize", - "value": "MaybeResponsive", - "description": "The maximum vertical size of the element in standard layouts (max-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the block axis.\n\nLearn more about the [max-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", - "isOptional": true, + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "maxInlineSize", - "value": "MaybeResponsive", - "description": "The maximum horizontal size of the element in standard layouts (max-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the inline axis.\n\nLearn more about the [max-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", - "isOptional": true, + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "minBlockSize", - "value": "MaybeResponsive", - "description": "The minimum vertical size of the element in standard layouts (min-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the block axis.\n\nLearn more about the [min-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", - "isOptional": true, + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "minInlineSize", - "value": "MaybeResponsive", - "description": "The minimum horizontal size of the element in standard layouts (min-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the inline axis.\n\nLearn more about the [min-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", - "isOptional": true, + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", "defaultValue": "'0'" }, { @@ -14116,7 +15685,7 @@ "syntaxKind": "PropertySignature", "name": "overflow", "value": "'hidden' | 'visible'", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "isOptional": true, "defaultValue": "'visible'" }, @@ -14125,209 +15694,185 @@ "syntaxKind": "PropertySignature", "name": "padding", "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding.", - "isOptional": true, + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingBlock", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingBlockEnd", - "value": "MaybeResponsive", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingBlockStart", - "value": "MaybeResponsive", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingInline", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingInlineEnd", - "value": "MaybeResponsive", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "paddingInlineStart", - "value": "MaybeResponsive", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`.", - "isOptional": true, + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", "defaultValue": "'' - meaning no override" } ], - "value": "export interface BaseBoxPropsWithRole\n extends BaseBoxProps,\n AccessibilityRoleProps {}" + "value": "export interface BoxJSXProps\n extends Partial,\n Pick {\n /**\n * The child elements to render inside the box.\n */\n children?: ComponentChildren;\n}" } }, - "ButtonBehaviorProps": { + "ButtonOnlyProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ButtonBehaviorProps", - "description": "", + "syntaxKind": "TypeAliasDeclaration", + "name": "ButtonOnlyProps", + "value": "", + "description": "The button-specific properties extracted from the base button props type, used internally for type safety.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", - "isOptional": true, - "defaultValue": "'--auto'" + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Button. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the Button text is not enough context for users using assistive technologies.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Button.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", - "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'--auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", + "name": "commandFor", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "loading", + "name": "disabled", "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", + "description": "Disables the Button meaning it cannot be clicked or receive focus.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onBlur", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "onClick", - "value": "(event: Event) => void", - "description": "A callback fired when the button is activated, before performing the action indicated by `type`. Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onFocus", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "type", - "value": "'submit' | 'button' | 'reset'", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "name": "icon", + "value": "IconType | AnyString", + "description": "The type of icon to be displayed in the Button.", "isOptional": true, - "defaultValue": "'button'" - } - ], - "value": "export interface ButtonBehaviorProps extends InteractionProps, FocusEventProps {\n /**\n * The behavior of the button component.\n *\n * - `button`: Used to indicate the component acts as a button, meaning it has no default action.\n * - `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n * - `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n *\n * This property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.\n *\n * @default 'button'\n */\n type?: 'submit' | 'button' | 'reset';\n /**\n * A callback fired when the button is activated, before performing the action indicated by `type`. Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n onClick?: (event: Event) => void;\n /**\n * Whether the button is disabled, preventing it from being clicked or receiving focus.\n *\n * @default false\n */\n disabled?: boolean;\n /**\n * Whether to replace the button content with a loading indicator while a background action is being performed.\n *\n * This also disables the button component.\n *\n * @default false\n */\n loading?: boolean;\n}" - } - }, - "LinkBehaviorProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "LinkBehaviorProps", - "description": "", - "isPublicDocs": true, - "members": [ + "defaultValue": "''" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", - "isOptional": true, - "defaultValue": "'--auto'" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", - "isOptional": true + "name": "inlineSize", + "value": "'auto' | 'fill' | 'fit-content'", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", + "isOptional": true, + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "download", + "name": "interestFor", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "href", + "name": "lang", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", - "isOptional": true + "name": "loading", + "value": "boolean", + "description": "Replaces content with a loading indicator while a background action is being performed.\n\nThis also disables the Button.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "onBlur", "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "description": "Callback when the element loses focus.", "isOptional": true }, { @@ -14335,7 +15880,7 @@ "syntaxKind": "PropertySignature", "name": "onClick", "value": "(event: Event) => void", - "description": "A callback fired when the link is activated, before navigating to the location specified by `href`. Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", + "description": "Callback when the Button is activated. This will be called before the action indicated by `type`.", "isOptional": true }, { @@ -14343,7 +15888,7 @@ "syntaxKind": "PropertySignature", "name": "onFocus", "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "description": "Callback when the element receives focus.", "isOptional": true }, { @@ -14351,63 +15896,63 @@ "syntaxKind": "PropertySignature", "name": "target", "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", "isOptional": true, "defaultValue": "'auto'" - } - ], - "value": "export interface LinkBehaviorProps extends InteractionProps, FocusEventProps {\n /**\n * The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.\n */\n href?: string;\n /**\n * The browsing context where the linked URL should be displayed.\n *\n * - `auto`: The target is automatically determined based on the origin of the URL.\n * - `_blank`: Opens the URL in a new window or tab.\n * - `_self`: Opens the URL in the same browsing context as the current one.\n * - `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n * - `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.\n *\n * @implementation Surfaces can set specific rules on how they handle each URL.\n * @implementation It’s expected that the behavior of `auto` is as `_self` except in specific cases.\n * @implementation For example, a surface could decide to open cross-origin URLs in a new window (as `_blank`).\n *\n * Learn more about the [target attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#target).\n *\n * @default 'auto'\n */\n target?: 'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString;\n /**\n * Prompts the browser to download the linked URL rather than navigate to it.\n * When set, the value specifies the suggested filename for the downloaded file.\n *\n * The filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes.\n * Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n *\n * Learn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).\n */\n download?: string;\n /**\n * A callback fired when the link is activated, before navigating to the location specified by `href`. Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n onClick?: (event: Event) => void;\n}" - } - }, - "InteractionProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "InteractionProps", - "description": "", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", + "name": "tone", + "value": "ToneKeyword", + "description": "Sets the tone of the Button based on the intention of the information being conveyed.", "isOptional": true, - "defaultValue": "'--auto'" + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", - "isOptional": true + "name": "type", + "value": "'submit' | 'button' | 'reset'", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "isOptional": true, + "defaultValue": "'button'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", - "isOptional": true + "name": "variant", + "value": "'auto' | 'primary' | 'secondary' | 'tertiary'", + "description": "Changes the visual appearance of the Button.", + "isOptional": true, + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" } - ], - "value": "export interface InteractionProps {\n /**\n * The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).\n */\n commandFor?: string;\n /**\n * The action that `commandFor` should take when this component is activated.\n *\n * - `--auto`: A default action for the target component.\n * - `--show`: Shows the target component.\n * - `--hide`: Hides the target component.\n * - `--toggle`: Toggles the visibility of the target component.\n * - `--copy`: Copies the target `ClipboardItem`.\n *\n * Learn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).\n *\n * @default '--auto'\n */\n command?: '--auto' | '--show' | '--hide' | '--toggle' | '--copy';\n /**\n * The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.\n */\n interestFor?: string;\n}" + ] } }, - "BaseClickableProps": { + "ButtonBaseProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseClickableProps", - "description": "", + "syntaxKind": "TypeAliasDeclaration", + "name": "ButtonBaseProps", + "value": "Required<\n Pick<\n ButtonOnlyProps,\n | 'accessibilityLabel'\n | 'disabled'\n | 'command'\n | 'commandFor'\n | 'icon'\n | 'interestFor'\n | 'lang'\n | 'loading'\n | 'type'\n | 'tone'\n | 'variant'\n | 'target'\n | 'href'\n | 'download'\n | 'inlineSize'\n >\n>", + "description": "The base required properties for the button component, including all essential button configuration options. This type ensures all button properties have default values.", "isPublicDocs": true, "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Button. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the Button text is not enough context for users using assistive technologies.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "command", "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", "isOptional": true, "defaultValue": "'--auto'" }, @@ -14416,7 +15961,7 @@ "syntaxKind": "PropertySignature", "name": "commandFor", "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", "isOptional": true }, { @@ -14424,7 +15969,7 @@ "syntaxKind": "PropertySignature", "name": "disabled", "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", + "description": "Disables the Button meaning it cannot be clicked or receive focus.", "isOptional": true, "defaultValue": "false" }, @@ -14433,7 +15978,7 @@ "syntaxKind": "PropertySignature", "name": "download", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", "isOptional": true }, { @@ -14441,56 +15986,67 @@ "syntaxKind": "PropertySignature", "name": "href", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", - "isOptional": true + "name": "icon", + "value": "IconType | AnyString", + "description": "The type of icon to be displayed in the Button.", + "isOptional": true, + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "loading", - "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", + "name": "inlineSize", + "value": "'auto' | 'fill' | 'fit-content'", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onBlur", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onClick", - "value": "(event: Event) => void", - "description": "A callback fired when the button is activated, before performing the action indicated by `type`. Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onFocus", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", - "isOptional": true + "name": "loading", + "value": "boolean", + "description": "Replaces content with a loading indicator while a background action is being performed.\n\nThis also disables the Button.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "target", "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "description": "Specifies where to display the linked URL.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "ToneKeyword", + "description": "Sets the tone of the Button based on the intention of the information being conveyed.", "isOptional": true, "defaultValue": "'auto'" }, @@ -14499,55 +16055,52 @@ "syntaxKind": "PropertySignature", "name": "type", "value": "'submit' | 'button' | 'reset'", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "isOptional": true, "defaultValue": "'button'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "variant", + "value": "'auto' | 'primary' | 'secondary' | 'tertiary'", + "description": "Changes the visual appearance of the Button.", + "isOptional": true, + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" } - ], - "value": "export interface BaseClickableProps\n extends ButtonBehaviorProps,\n LinkBehaviorProps {}" + ] } }, - "BaseInputProps": { + "ButtonProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseInputProps", - "description": "", + "name": "ButtonProps", + "description": "The properties for the button component. Buttons trigger actions or navigation when clicked, with customizable visual styles, states, and optional icons.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", - "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", - "isOptional": true, - "defaultValue": "false" + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Button. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the Button text is not enough context for users using assistive technologies.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "name", - "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", - "isOptional": true - } - ], - "value": "export interface BaseInputProps {\n /**\n * The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.\n */\n name?: string;\n /**\n * Whether the field is disabled, preventing any user interaction.\n *\n * @default false\n */\n disabled?: boolean;\n}" - } - }, - "InputProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "InputProps", - "description": "", - "isPublicDocs": true, - "members": [ + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultValue", + "name": "commandFor", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", "isOptional": true }, { @@ -14555,647 +16108,476 @@ "syntaxKind": "PropertySignature", "name": "disabled", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Disables the Button meaning it cannot be clicked or receive focus.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "name", + "name": "download", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onChange", - "value": "(event: Event) => void", - "description": "A callback fired when the user has finished editing the field, such as when they blur the field or press Enter. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onInput", - "value": "(event: Event) => void", - "description": "A callback fired when the user makes any changes in the field, such as typing a character. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).", - "isOptional": true + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type or an empty string to display no icon.", + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "value", - "value": "string", - "description": "", - "isOptional": true - } - ], - "value": "export interface InputProps extends BaseInputProps {\n /**\n * A callback fired when the user has finished editing the field, such as when they blur the field or press Enter. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n onChange?: (event: Event) => void;\n /**\n * A callback fired when the user makes any changes in the field, such as typing a character. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).\n */\n onInput?: (event: Event) => void;\n value?: string;\n /**\n * The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.\n *\n * @implementation `defaultValue` reflects to the `value` attribute.\n */\n defaultValue?: string;\n}" - } - }, - "MultipleInputProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "MultipleInputProps", - "description": "", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "disabled", - "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "name": "inlineSize", + "value": "'auto' | 'fill' | 'fit-content'", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "name", + "name": "interestFor", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "onChange", - "value": "(event: Event) => void", - "description": "A callback fired when the user has selected one or more options. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onInput", - "value": "(event: Event) => void", - "description": "A callback fired when the user selects or deselects options. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "values", - "value": "string[]", - "description": "An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected.", - "isOptional": true - } - ], - "value": "export interface MultipleInputProps extends BaseInputProps {\n /**\n * A callback fired when the user has selected one or more options. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n onChange?: (event: Event) => void;\n /**\n * A callback fired when the user selects or deselects options. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).\n */\n onInput?: (event: Event) => void;\n /**\n * An array of `value` attributes for the currently selected options. When provided, this property automatically sets the `selected` state on child option components that have matching `value` attributes. Options with values included in this array will be marked as selected, while others will be unselected.\n */\n values?: string[];\n}" - } - }, - "FileInputProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "FileInputProps", - "description": "", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "disabled", + "name": "loading", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Replaces content with a loading indicator while a background action is being performed.\n\nThis also disables the Button.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "files", - "value": "ReadonlyArray", - "description": "An array of File objects representing the files currently selected by the user.\n\nThis property is read-only and cannot be directly modified. To clear the selected files, set the `value` prop to an empty string or null.", + "name": "target", + "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", + "description": "Specifies where to display the linked URL.", "isOptional": true, - "defaultValue": "[]" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "name", - "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", - "isOptional": true + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onChange", - "value": "(event: Event) => void", - "description": "A callback fired when the user has finished selecting one or more files.", - "isOptional": true + "name": "tone", + "value": "'critical' | 'auto' | 'neutral'", + "description": "Determines the visual appearance and semantic meaning of the button. Buttons rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - Lets the system automatically choose the appropriate tone based on context.\n- `'neutral'` - Standard styling for general actions without specific semantic meaning.\n- `'critical'` - Red styling for destructive actions that can't be undone, such as deleting data.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onInput", - "value": "(event: Event) => void", - "description": "A callback fired when the user makes any changes to the file selection.", - "isOptional": true + "name": "type", + "value": "'submit' | 'button' | 'reset'", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "isOptional": true, + "defaultValue": "'button'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "value", - "value": "string", - "description": "A string that represents the path to the selected file(s). If no file is selected yet, the value is an empty string (\"\"). When the user selected multiple files, the value represents the first file in the list of files they selected. The value is always the file's name prefixed with \"C:\\fakepath\\\", which isn't the real path of the file.\n\nLearn more about the [file input value](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input/file#value).", + "name": "variant", + "value": "'auto' | 'primary' | 'secondary' | 'tertiary'", + "description": "Changes the visual appearance of the Button.", "isOptional": true, - "defaultValue": "''" + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" } ], - "value": "export interface FileInputProps extends BaseInputProps {\n /**\n * A callback fired when the user has finished selecting one or more files.\n */\n onChange?: (event: Event) => void;\n /**\n * A callback fired when the user makes any changes to the file selection.\n */\n onInput?: (event: Event) => void;\n /**\n * A string that represents the path to the selected file(s). If no file is selected yet, the value is an empty string (\"\").\n * When the user selected multiple files, the value represents the first file in the list of files they selected.\n * The value is always the file's name prefixed with \"C:\\fakepath\\\", which isn't the real path of the file.\n *\n * Learn more about the [file input value](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input/file#value).\n *\n * @default ''\n */\n value?: string;\n /**\n * An array of File objects representing the files currently selected by the user.\n *\n * This property is read-only and cannot be directly modified.\n * To clear the selected files, set the `value` prop to an empty string or null.\n *\n * @default []\n */\n files?: ReadonlyArray;\n}" + "value": "export interface ButtonProps extends ButtonBaseProps {\n /**\n * Determines the visual appearance and semantic meaning of the button. Buttons rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n * - `'auto'` - Lets the system automatically choose the appropriate tone based on context.\n * - `'neutral'` - Standard styling for general actions without specific semantic meaning.\n * - `'critical'` - Red styling for destructive actions that can't be undone, such as deleting data.\n *\n * @default 'auto'\n */\n tone: Extract;\n /**\n * The icon to display inside the button. Accepts any valid icon type or an empty string to display no icon.\n *\n * @default ''\n */\n icon: IconProps['type'];\n}" } }, - "FieldErrorProps": { + "ButtonJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "FieldErrorProps", - "description": "", + "name": "ButtonJSXProps", + "description": "The JSX props for the button component. These properties extend `ButtonProps` with event callbacks and additional options for rendering buttons in JSX.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", + "name": "accessibilityLabel", "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "description": "A label that describes the purpose or contents of the Button. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the Button text is not enough context for users using assistive technologies.", "isOptional": true - } - ], - "value": "export interface FieldErrorProps {\n /**\n * An error message displayed below the checkbox to indicate validation problems.\n * When set, the checkbox is styled with error indicators and the message is announced to screen readers.\n */\n error?: string;\n}" - } - }, - "BasicFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "BasicFieldProps", - "description": "", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "name": "children", + "value": "ComponentChildren", + "description": "The text label or content to display inside the button. Can be plain text or other components.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", - "isOptional": true + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "labelAccessibilityVisibility", - "value": "'visible' | 'exclusive'", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", - "isOptional": true, - "defaultValue": "'visible'" + "name": "commandFor", + "value": "string", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "required", + "name": "disabled", "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "description": "Disables the Button meaning it cannot be clicked or receive focus.", "isOptional": true, "defaultValue": "false" - } - ], - "value": "export interface BasicFieldProps\n extends FieldErrorProps,\n LabelAccessibilityVisibilityProps {\n /**\n * Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.\n *\n * @default false\n */\n required?: boolean;\n /**\n * The text displayed as the field label, which identifies the purpose of the field to users.\n * This label is associated with the field for accessibility and helps users understand what information to provide.\n */\n label?: string;\n}" - } - }, - "FieldDetailsProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "FieldDetailsProps", - "description": "", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "details", + "name": "download", "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", "isOptional": true - } - ], - "value": "export interface FieldDetailsProps {\n /**\n * Supplementary text displayed below the checkbox to provide additional context, instructions, or help.\n * Use this to explain what checking the box means or provide guidance to users.\n * This text is announced to screen readers.\n */\n details?: string;\n}" - } - }, - "FieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "FieldProps", - "description": "", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultValue", + "name": "href", "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "details", + "name": "icon", + "value": "\"\" | IconType", + "description": "The icon to display inside the button. Accepts any valid icon type or an empty string to display no icon.", + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", - "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "name": "inlineSize", + "value": "'auto' | 'fill' | 'fit-content'", + "description": "The displayed inline width of the Button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", + "name": "interestFor", "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "label", + "name": "lang", "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "labelAccessibilityVisibility", - "value": "'visible' | 'exclusive'", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "name": "loading", + "value": "boolean", + "description": "Replaces content with a loading indicator while a background action is being performed.\n\nThis also disables the Button.", "isOptional": true, - "defaultValue": "'visible'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "name", - "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", - "isOptional": true + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "onBlur", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "value": "((event: CallbackEvent) => void) | null", + "description": "Callback function that's invoked when the button loses focus. Receives the blur event as an argument.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onChange", - "value": "(event: Event) => void", - "description": "A callback fired when the user has finished editing the field, such as when they blur the field or press Enter. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "name": "onClick", + "value": "((event: CallbackEvent) => void) | null", + "description": "Callback function that's invoked when the button is clicked. Receives the click event as an argument.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "onFocus", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "value": "((event: CallbackEvent) => void) | null", + "description": "Callback function that's invoked when the button receives focus. Receives the focus event as an argument.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onInput", - "value": "(event: Event) => void", - "description": "A callback fired when the user makes any changes in the field, such as typing a character. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).", - "isOptional": true + "name": "target", + "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", + "description": "Specifies where to display the linked URL.", + "isOptional": true, + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "placeholder", - "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", - "isOptional": true + "name": "tone", + "value": "'critical' | 'auto' | 'neutral'", + "description": "Determines the visual appearance and semantic meaning of the button. Buttons rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - Lets the system automatically choose the appropriate tone based on context.\n- `'neutral'` - Standard styling for general actions without specific semantic meaning.\n- `'critical'` - Red styling for destructive actions that can't be undone, such as deleting data.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "required", - "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "name": "type", + "value": "'submit' | 'button' | 'reset'", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'button'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "value", - "value": "string", - "description": "", - "isOptional": true + "name": "variant", + "value": "'auto' | 'primary' | 'secondary' | 'tertiary'", + "description": "Changes the visual appearance of the Button.", + "isOptional": true, + "defaultValue": "'auto' - the variant is automatically determined by the Button's context" } ], - "value": "export interface FieldProps\n extends BasicFieldProps,\n InputProps,\n FocusEventProps,\n FieldDetailsProps {\n /**\n * The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.\n */\n placeholder?: string;\n}" + "value": "export interface ButtonJSXProps\n extends Partial,\n Pick {\n /**\n * The text label or content to display inside the button. Can be plain text or other components.\n */\n children?: ComponentChildren;\n /**\n * Callback function that's invoked when the button is clicked. Receives the click event as an argument.\n */\n onClick?: ((event: CallbackEvent) => void) | null;\n /**\n * Callback function that's invoked when the button receives focus. Receives the focus event as an argument.\n */\n onFocus?: ((event: CallbackEvent) => void) | null;\n /**\n * Callback function that's invoked when the button loses focus. Receives the blur event as an argument.\n */\n onBlur?: ((event: CallbackEvent) => void) | null;\n}" } }, - "BaseTextFieldProps": { + "ButtonGroupProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseTextFieldProps", - "description": "", + "name": "ButtonGroupProps", + "description": "Properties for rendering a button group that arranges multiple buttons together with consistent spacing and semantic grouping.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultValue", - "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "details", + "name": "accessibilityLabel", "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", + "description": "Label for the button group that describes the content of the group for screen reader users to understand what's included.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", - "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "name": "gap", + "value": "'base' | 'none'", + "description": "The gap between elements.", "isOptional": true, - "defaultValue": "false" - }, + "defaultValue": "'base'" + } + ], + "value": "export interface ButtonGroupProps\n extends Required> {}" + } + }, + "ButtonGroupJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ButtonGroupJSXProps", + "description": "Properties for using the button group component in JSX with React-style props.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", + "name": "accessibilityLabel", "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", + "description": "Label for the button group that describes the content of the group for screen reader users to understand what's included.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", + "name": "children", + "value": "ComponentChildren", + "description": "The buttons that should be grouped together, provided as Button components.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "labelAccessibilityVisibility", - "value": "'visible' | 'exclusive'", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", + "name": "gap", + "value": "'base' | 'none'", + "description": "The gap between elements.", "isOptional": true, - "defaultValue": "'visible'" + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "name", + "name": "id", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "onBlur", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "onChange", - "value": "(event: Event) => void", - "description": "A callback fired when the user has finished editing the field, such as when they blur the field or press Enter. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "onFocus", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "onInput", - "value": "(event: Event) => void", - "description": "A callback fired when the user makes any changes in the field, such as typing a character. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "placeholder", - "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", + "name": "primaryAction", + "value": "ComponentChildren", + "description": "A single primary action button that's visually emphasized as the most important action in the group.\n\nAccepts a single Button element with a `variant` of `primary`. Can't be used when `gap` is set to `none`.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "readOnly", - "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", - "isOptional": true, - "defaultValue": "false" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "required", - "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", - "isOptional": true, - "defaultValue": "false" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "value", - "value": "string", - "description": "", + "name": "secondaryActions", + "value": "ComponentChildren", + "description": "One or more secondary action buttons that provide alternative or less prominent actions.\n\nAccepts Button elements with a `variant` of `secondary` or `auto`.", "isOptional": true } ], - "value": "export interface BaseTextFieldProps extends FieldProps {\n /**\n * Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.\n *\n * @default false\n */\n readOnly?: boolean;\n}" + "value": "export interface ButtonGroupJSXProps\n extends Partial,\n Pick {\n /**\n * The buttons that should be grouped together, provided as Button components.\n */\n children?: ComponentChildren;\n /**\n * A single primary action button that's visually emphasized as the most important action in the group.\n *\n * Accepts a single Button element with a `variant` of `primary`. Can't be used when `gap` is set to `none`.\n */\n primaryAction?: ComponentChildren;\n /**\n * One or more secondary action buttons that provide alternative or less prominent actions.\n *\n * Accepts Button elements with a `variant` of `secondary` or `auto`.\n */\n secondaryActions?: ComponentChildren;\n}" } }, - "FieldDecorationProps": { + "CheckboxProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "FieldDecorationProps", - "description": "", + "name": "CheckboxProps", + "description": "Properties for rendering a checkbox that supports checked, unchecked, and indeterminate states for complex selection scenarios.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessory", - "value": "ComponentChildren", - "description": "Additional content to be displayed in the field. Commonly used to display an icon that activates a tooltip providing more information.", + "name": "accessibilityLabel", + "value": "string", + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "icon", - "value": "IconType | AnyString", - "description": "An icon displayed inside the field to provide visual context about the expected input or field purpose. Commonly used for search fields, currency inputs, or to indicate field type. Accepts any icon name from the icon library or a custom string identifier.", + "name": "checked", + "value": "boolean", + "description": "Whether the control is active.", "isOptional": true, - "defaultValue": "''" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "prefix", - "value": "string", - "description": "A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n\nThis text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.", + "name": "defaultChecked", + "value": "boolean", + "description": "Whether the control is active by default.", "isOptional": true, - "defaultValue": "''" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "suffix", - "value": "string", - "description": "A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n\nThis text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.", - "isOptional": true, - "defaultValue": "''" - } - ], - "value": "export interface FieldDecorationProps {\n /**\n * A non-editable text value displayed immediately after the editable portion of the field. This is useful for displaying an implied part of the value, such as `@shopify.com` or `%`.\n *\n * This text can't be edited by the user and is not included in the field's value. The suffix might not appear until the user interacts with the field. For example, an inline label might occupy the suffix position until the user focuses the field.\n *\n * @default ''\n */\n suffix?: string;\n /**\n * A non-editable text value displayed immediately before the editable portion of the field. This is useful for displaying an implied part of the value, such as `https://` or `+353`.\n *\n * This text can't be edited by the user and is not included in the field's value. The prefix might not appear until the user interacts with the field. For example, an inline label might occupy the prefix position until the user focuses the field.\n *\n * @default ''\n */\n prefix?: string;\n /**\n * An icon displayed inside the field to provide visual context about the expected input or field purpose.\n * Commonly used for search fields, currency inputs, or to indicate field type.\n * Accepts any icon name from the icon library or a custom string identifier.\n *\n * @default ''\n */\n icon?: IconType | AnyString;\n /**\n * Additional content to be displayed in the field.\n * Commonly used to display an icon that activates a tooltip providing more information.\n */\n accessory?: ComponentChildren;\n}" - } - }, - "NumberConstraintsProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "NumberConstraintsProps", - "description": "", - "isPublicDocs": true, - "members": [ + "name": "defaultIndeterminate", + "value": "boolean", + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered, useful for partial selection scenarios.", + "defaultValue": "false" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "controls", - "value": "'auto' | 'stepper' | 'none'", - "description": "The type of controls displayed in the field.\n\n- `stepper`: displays buttons to increase or decrease the value of the field by the stepping interval defined in the `step` property. Appropriate mouse and [keyboard interactions](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/spinbutton_role#keyboard_interactions) to control the value of the field are enabled.\n- `none`: no controls are displayed and users must input the value manually. Arrow keys and scroll wheels can’t be used either to avoid accidental changes.\n- `auto`: the presence of the controls depends on the surface and context.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "max", - "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", + "name": "disabled", + "value": "boolean", + "description": "Disables the control, disallowing any interaction.", "isOptional": true, - "defaultValue": "Infinity" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "min", - "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", - "isOptional": true, - "defaultValue": "-Infinity" + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "step", - "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", - "isOptional": true, - "defaultValue": "1" - } - ], - "value": "export interface NumberConstraintsProps {\n /**\n * The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n *\n * Users can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.\n *\n * @default Infinity\n */\n max?: number;\n /**\n * The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n *\n * Users can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.\n *\n * @default -Infinity\n */\n min?: number;\n /**\n * The amount the value can increase or decrease by. This can be an integer or decimal.\n * If a `max` or `min` is specified with `step` when increasing/decreasing the value\n * via the buttons, the final value will always round to the `max` or `min`\n * rather than the closest valid amount.\n *\n * @default 1\n */\n step?: number;\n /**\n * The type of controls displayed in the field.\n *\n * - `stepper`: displays buttons to increase or decrease the value of the field by the stepping interval defined in the `step` property.\n * Appropriate mouse and [keyboard interactions](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/spinbutton_role#keyboard_interactions) to control the value of the field are enabled.\n * - `none`: no controls are displayed and users must input the value manually. Arrow keys and scroll wheels can’t be used either to avoid accidental changes.\n * - `auto`: the presence of the controls depends on the surface and context.\n *\n * @default 'auto'\n */\n controls?: 'auto' | 'stepper' | 'none';\n}" - } - }, - "MinMaxLengthProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "MinMaxLengthProps", - "description": "", - "isPublicDocs": true, - "members": [ + "name": "indeterminate", + "value": "boolean", + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark to represent a partial selection." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxLength", - "value": "number", - "description": "The maximum number of characters allowed in the field.", - "isOptional": true, - "defaultValue": "Infinity" + "name": "label", + "value": "string | ComponentChildren", + "description": "Visual content to use as the control label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minLength", - "value": "number", - "description": "The minimum number of characters required in the field.", - "isOptional": true, - "defaultValue": "0" - } - ], - "value": "export interface MinMaxLengthProps {\n /**\n * The maximum number of characters allowed in the field.\n *\n * @default Infinity\n */\n maxLength?: number;\n /**\n * The minimum number of characters required in the field.\n *\n * @default 0\n */\n minLength?: number;\n}" - } - }, - "BaseSelectableProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "BaseSelectableProps", - "description": "", - "isPublicDocs": true, - "members": [ + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "", + "defaultValue": "'visible'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityLabel", + "name": "name", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "An identifier for the control that is unique within the nearest containing `Form` component.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", + "name": "required", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "isOptional": true, "defaultValue": "false" }, @@ -15204,18 +16586,17 @@ "syntaxKind": "PropertySignature", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\".", - "isOptional": true + "description": "" } ], - "value": "export interface BaseSelectableProps {\n /**\n * A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.\n */\n accessibilityLabel?: string;\n /**\n * Whether the checkbox is disabled, preventing user interaction.\n * Disabled checkboxes appear dimmed and their values aren't submitted with forms.\n *\n * @default false\n */\n disabled?: boolean;\n /**\n * The value submitted with the form when this checkbox is checked.\n * If not specified, the default value is \"on\".\n */\n value?: string;\n}" + "value": "export interface CheckboxProps extends PreactCheckboxProps {\n /**\n * Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark to represent a partial selection.\n */\n indeterminate: Required['indeterminate'];\n /**\n * Whether the checkbox should be in an indeterminate state when it's first rendered, useful for partial selection scenarios.\n */\n defaultIndeterminate: Required['defaultIndeterminate'];\n labelAccessibilityVisibility: Required['labelAccessibilityVisibility'];\n}" } }, - "BaseOptionProps": { + "CheckboxJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseOptionProps", - "description": "", + "name": "CheckboxJSXProps", + "description": "Props for using the checkbox component in JSX with React-style event handlers.", "isPublicDocs": true, "members": [ { @@ -15223,164 +16604,148 @@ "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultSelected", + "name": "checked", "value": "boolean", - "description": "The initial selected state for uncontrolled components. Use this when you want the option to start selected but don't need to control its state afterward.", + "description": "Whether the control is active.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", + "name": "defaultChecked", "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", + "description": "Whether the control is active by default.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "selected", + "name": "defaultIndeterminate", "value": "boolean", - "description": "Whether the option is currently selected. Use this for controlled components where you manage the selection state.", - "isOptional": true, + "description": "Whether the checkbox should be in an indeterminate state when it's first rendered, useful for partial selection scenarios.", "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "value", - "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\".", - "isOptional": true - } - ], - "value": "export interface BaseOptionProps extends BaseSelectableProps {\n /**\n * Whether the option is currently selected. Use this for controlled components where you manage the selection state.\n *\n * @default false\n */\n selected?: boolean;\n /**\n * The initial selected state for uncontrolled components. Use this when you want the option to start selected\n * but don't need to control its state afterward.\n *\n * @implementation `defaultSelected` reflects to the `selected` attribute.\n *\n * @default false\n */\n defaultSelected?: boolean;\n}" - } - }, - "BaseCheckableProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "BaseCheckableProps", - "description": "", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "name": "details", + "value": "preact.ComponentChildren", + "description": "", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "checked", + "name": "disabled", "value": "boolean", - "description": "Whether the control is currently checked. Use this for controlled components where you manage the checked state.", + "description": "Disables the control, disallowing any interaction.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", - "isOptional": true, - "defaultValue": "'--auto'" + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", + "name": "id", "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultChecked", + "name": "indeterminate", "value": "boolean", - "description": "The initial checked state for uncontrolled components. Use this when you want the control to start checked but don't need to control its state afterward.", - "isOptional": true, - "defaultValue": "false" + "description": "Whether the checkbox is in an indeterminate state, showing a dash instead of a checkmark to represent a partial selection." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", - "value": "boolean", - "description": "Whether the checkbox is disabled, preventing user interaction. Disabled checkboxes appear dimmed and their values aren't submitted with forms.", - "isOptional": true, - "defaultValue": "false" + "name": "label", + "value": "string | ComponentChildren", + "description": "Visual content to use as the control label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", - "isOptional": true + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "", + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "label", + "name": "name", "value": "string", - "description": "The text label displayed next to the checkbox that describes what the checkbox controls. Clicking the label will also toggle the checkbox state.", + "description": "An identifier for the control that is unique within the nearest containing `Form` component.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "name", - "value": "string", - "description": "The name used to identify this checkbox in form submissions. When the checkbox is checked, its `name` and `value` are included in the form data. Must be unique within the containing form.", + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "onChange", - "value": "(event: Event) => void", - "description": "A callback that is run whenever the control is changed. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the checkbox's checked state changes and it loses focus.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "onInput", - "value": "(event: Event) => void", - "description": "A callback that is run whenever the control is changed. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the checkbox's checked state changes.", "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "value", "value": "string", - "description": "The value submitted with the form when this checkbox is checked. If not specified, the default value is \"on\".", - "isOptional": true + "description": "" } ], - "value": "export interface BaseCheckableProps\n extends BaseSelectableProps,\n InteractionProps {\n /**\n * The text label displayed next to the checkbox that describes what the checkbox controls.\n * Clicking the label will also toggle the checkbox state.\n */\n label?: string;\n /**\n * Whether the control is currently checked. Use this for controlled components where you manage the checked state.\n *\n * @default false\n */\n checked?: boolean;\n /**\n * The initial checked state for uncontrolled components. Use this when you want the control to start checked\n * but don't need to control its state afterward.\n *\n * @implementation `defaultChecked` reflects to the `checked` attribute.\n *\n * @default false\n */\n defaultChecked?: boolean;\n /**\n * The name used to identify this checkbox in form submissions.\n * When the checkbox is checked, its `name` and `value` are included in the form data.\n * Must be unique within the containing form.\n */\n name?: string;\n /**\n * A callback that is run whenever the control is changed. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n onChange?: (event: Event) => void;\n /**\n * A callback that is run whenever the control is changed. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).\n */\n onInput?: (event: Event) => void;\n}" + "value": "export interface CheckboxJSXProps\n extends Partial>,\n Pick,\n FieldSlotInternalReactProps {\n /**\n * A callback that's triggered when the checkbox's checked state changes and it loses focus.\n */\n onChange?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the checkbox's checked state changes.\n */\n onInput?: ((event: CallbackEvent) => void) | null;\n onBlur?: ((event: CallbackEvent) => void) | null;\n}" } }, - "ChipProps$1": { + "ChoiceProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ChipProps$1", - "description": "", + "name": "ChoiceProps", + "description": "Properties for rendering a single choice within a choice list that can be selected using a radio button or checkbox.", "isPublicDocs": true, "members": [ { @@ -15388,1243 +16753,1084 @@ "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The text label displayed within the chip component, typically representing a selected filter, tag, or removable item.", - "isOptional": true + "name": "defaultSelected", + "value": "boolean", + "description": "Whether the control is active by default.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "color", - "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.", + "name": "disabled", + "value": "boolean", + "description": "Disables the control, disallowing any interaction.", "isOptional": true, - "defaultValue": "'base'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "graphic", - "value": "ComponentChildren", - "description": "The graphic to display inside of the chip.", - "isOptional": true + "name": "selected", + "value": "boolean", + "description": "Whether the control is active.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", + "name": "value", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "The value used in form data when the control is checked.", "isOptional": true } ], - "value": "export interface ChipProps$1 extends GlobalProps {\n /**\n * The text label displayed within the chip component, typically representing a selected filter, tag, or removable item.\n */\n children?: ComponentChildren;\n /**\n * The graphic to display inside of the chip.\n *\n * @implementation Only `s-icon` is supported.\n */\n graphic?: ComponentChildren;\n /**\n * A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.\n */\n accessibilityLabel?: string;\n /**\n * The color emphasis level that controls visual intensity.\n *\n * @default 'base'\n */\n color?: ColorKeyword;\n}" + "value": "export interface ChoiceProps\n extends Required<\n Pick<\n ChoiceProps$1,\n | 'selected'\n | 'defaultSelected'\n | 'disabled'\n | 'accessibilityLabel'\n | 'value'\n >\n > {}" } }, - "AutocompleteProps": { + "ChoiceJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "AutocompleteProps", - "description": "", + "name": "ChoiceJSXProps", + "description": "Properties for using the choice component in JSX with React-style props.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "autocomplete", - "value": "| AutocompleteField\n | `${AutocompleteSection} ${AutocompleteField}`\n | `${AutocompleteGroup} ${AutocompleteField}`\n | `${AutocompleteSection} ${AutocompleteGroup} ${AutocompleteField}`\n | 'on'\n | 'off'", - "description": "A hint about the intended content of the field for browser autofill.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", + "name": "accessibilityLabel", + "value": "string", + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content that's used as the choice label, extracted as plain text from any provided markup.\n\nThe label is produced by extracting and concatenating the text nodes from the provided content; any markup or element structure is ignored.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultSelected", + "value": "boolean", + "description": "Whether the control is active by default.", "isOptional": true, - "defaultValue": "'on' for everything else" - } - ], - "value": "export interface AutocompleteProps<\n AutocompleteField extends AnyAutocompleteField,\n> {\n /**\n * A hint about the intended content of the field for browser autofill.\n *\n * When set to `on` (the default), this property indicates that the field should support\n * autofill, but you do not have any more semantic information on the intended\n * contents.\n *\n * When set to `off`, you are indicating that this field contains sensitive\n * information, or contents that are never saved, like one-time codes.\n *\n * Alternatively, you can provide value which describes the\n * specific data you would like to be entered into this field during autofill.\n *\n * Learn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.\n *\n * @default 'tel' for PhoneField\n * @default 'email' for EmailField\n * @default 'url' for URLField\n * @default 'on' for everything else\n */\n autocomplete?:\n | AutocompleteField\n | `${AutocompleteSection} ${AutocompleteField}`\n | `${AutocompleteGroup} ${AutocompleteField}`\n | `${AutocompleteSection} ${AutocompleteGroup} ${AutocompleteField}`\n | 'on'\n | 'off';\n}" - } - }, - "AutocompleteSection": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "AutocompleteSection", - "value": "`section-${string}`", - "description": "The “section” scopes the autocomplete data that should be inserted to a specific area of the page.\n\nCommonly used when there are multiple fields with the same autocomplete needs in the same page. For example: 2 shipping address forms in the same page.", - "isPublicDocs": true - } - }, - "AutocompleteGroup": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "AutocompleteGroup", - "value": "'shipping' | 'billing'", - "description": "The contact information group the autocomplete data should be sourced from.", - "isPublicDocs": true - } - }, - "AutocompleteAddressGroup": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "AutocompleteAddressGroup", - "value": "'fax' | 'home' | 'mobile' | 'pager'", - "description": "The contact information subgroup the autocomplete data should be sourced from.", - "isPublicDocs": true - } - }, - "AnyAutocompleteField": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "AnyAutocompleteField", - "value": "'additional-name' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'country-name' | 'country' | 'current-password' | 'email' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'language' | 'name' | 'new-password' | 'nickname' | 'one-time-code' | 'organization-title' | 'organization' | 'photo' | 'postal-code' | 'sex' | 'street-address' | 'transaction-amount' | 'transaction-currency' | 'url' | 'username' | 'bday-day' | 'bday-month' | 'bday-year' | 'bday' | 'cc-additional-name' | 'cc-expiry-month' | 'cc-expiry-year' | 'cc-expiry' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-number' | 'cc-csc' | 'cc-type' | `${AutocompleteAddressGroup} email` | 'impp' | `${AutocompleteAddressGroup} impp` | 'tel' | 'tel-area-code' | 'tel-country-code' | 'tel-extension' | 'tel-local-prefix' | 'tel-local-suffix' | 'tel-local' | 'tel-national' | `${AutocompleteAddressGroup} tel` | `${AutocompleteAddressGroup} tel-area-code` | `${AutocompleteAddressGroup} tel-country-code` | `${AutocompleteAddressGroup} tel-extension` | `${AutocompleteAddressGroup} tel-local-prefix` | `${AutocompleteAddressGroup} tel-local-suffix` | `${AutocompleteAddressGroup} tel-local` | `${AutocompleteAddressGroup} tel-national`", - "description": "Represents all possible autocomplete field values as defined by the HTML autocomplete specification. These values help browsers provide appropriate autofill suggestions for form fields.\n\nLearn more about [autocomplete values](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete).", - "isPublicDocs": true - } - }, - "FunctionSettingsError": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "FunctionSettingsError", - "description": "Represents an error that occurs when saving function settings data.\n\nThese errors are returned when the extension-provided data fails validation or causes issues during the commit process to Shopify's servers. Handle these errors in the `onError` callback to provide feedback to users about what went wrong.", - "isPublicDocs": true, - "members": [ + "defaultValue": "false" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "code", - "value": "string", - "description": "A unique identifier describing the “class” of error. These will match the GraphQL error codes as closely as possible. For example the enums returned by the `metafieldsSet` mutation.\n\nLearn more about [MetafieldsSetUserErrorCode](https://shopify.dev/docs/api/admin-graphql/latest/enums/MetafieldsSetUserErrorCode)." + "name": "details", + "value": "ComponentChildren", + "description": "Additional text that provides context or guidance for the input, displayed alongside the choice label.\n\nThis text is displayed along with the input and its label to offer more information or instructions to the user.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "message", + "name": "disabled", + "value": "boolean", + "description": "Disables the control, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", "value": "string", - "description": "" + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "name", - "value": "'FunctionSettingsError'", - "description": "The error type name, always set to `FunctionSettingsError`.\n\nThis helps identify errors specific to function settings, distinguishing them from other error types." + "name": "secondaryContent", + "value": "ComponentChildren", + "description": "Additional content to display below the choice label. Can include rich content like TextFields, Buttons, or other interactive components. Event handlers on React components are preserved.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "stack", + "name": "selected", + "value": "boolean", + "description": "Whether the control is active.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", "value": "string", - "description": "", + "description": "The value used in form data when the control is checked.", "isOptional": true } ], - "value": "export interface FunctionSettingsError extends Error {\n /**\n * A unique identifier describing the “class” of error. These will match\n * the GraphQL error codes as closely as possible. For example the enums\n * returned by the `metafieldsSet` mutation.\n *\n * Learn more about [MetafieldsSetUserErrorCode](https://shopify.dev/docs/api/admin-graphql/latest/enums/MetafieldsSetUserErrorCode).\n */\n code: string;\n /**\n * The error type name, always set to `FunctionSettingsError`.\n *\n * This helps identify errors specific to function settings, distinguishing them from other error types.\n */\n name: 'FunctionSettingsError';\n}" + "value": "export interface ChoiceJSXProps\n extends Partial,\n Pick {\n /**\n * The content that's used as the choice label, extracted as plain text from any provided markup.\n *\n * The label is produced by extracting and concatenating the text nodes from the provided content; any markup or element structure is ignored.\n */\n children?: ComponentChildren;\n /**\n * Additional text that provides context or guidance for the input, displayed alongside the choice label.\n *\n * This text is displayed along with the input and its label to offer more information or instructions to the user.\n *\n * @implementation this content should be linked to the input with an `aria-describedby` attribute.\n */\n details?: ComponentChildren;\n /**\n * Additional content to display below the choice label.\n * Can include rich content like TextFields, Buttons, or other interactive components.\n * Event handlers on React components are preserved.\n */\n secondaryContent?: ComponentChildren;\n}" } }, - "BaseTypographyProps": { + "ChoiceListProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BaseTypographyProps", - "description": "", + "name": "ChoiceListProps", + "description": "Properties for rendering a list of choices that lets users select one or more options using radio buttons or checkboxes.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "color", - "value": "ColorKeyword", - "description": "The color emphasis level that controls visual intensity.\n\n- `base`: Primary color for body text, standard UI elements, and general content with good readability.\n- `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.", + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.\n\n`disabled` on any child choices is ignored when this is true.", "isOptional": true, - "defaultValue": "'base'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "dir", - "value": "'ltr' | 'rtl' | 'auto' | ''", - "description": "Indicates the directionality of the element’s text.\n\n- `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n- `auto`: The user agent determines the direction based on the content.\n- `ltr`: The languages written from left to right (such as English).\n- `rtl`: The languages written from right to left (such as Arabic).\n\nLearn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).", + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "''" + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "fontVariantNumeric", - "value": "'auto' | 'normal' | 'tabular-nums'", - "description": "The rendering style for numbers in the font.\n\n- `auto`: Inherits the setting from the parent element.\n- `normal`: Uses the font's default numeric glyphs.\n- `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n\nLearn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).", + "name": "multiple", + "value": "boolean", + "description": "Whether multiple choices can be selected.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "lang", + "name": "name", "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation.\n\nThe value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry).\n\nIt is recommended to combine it with the `dir` attribute to ensure the text is rendered correctly if the surrounding content’s direction is different.", - "isOptional": true, - "defaultValue": "''" + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "tone", - "value": "ToneKeyword", - "description": "The semantic meaning and color treatment of the component.\n\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `caution`: Advisory notices that need attention.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `accent`: Highlighted or promotional content.\n- `custom`: Custom styling controlled by your theme.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "values", + "value": "string[]", + "description": "An array of the `value`s of the selected options.\n\nThis is a convenience prop for setting the `selected` prop on child options.", + "isOptional": true } ], - "value": "export interface BaseTypographyProps {\n /**\n * The color emphasis level that controls visual intensity.\n *\n * - `base`: Primary color for body text, standard UI elements, and general content with good readability.\n * - `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements.\n *\n * @default 'base'\n */\n color?: ColorKeyword;\n /**\n * The semantic meaning and color treatment of the component.\n *\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent.\n * - `info`: Informational content or helpful tips.\n * - `success`: Positive outcomes or successful states.\n * - `caution`: Advisory notices that need attention.\n * - `warning`: Important warnings about potential issues.\n * - `critical`: Urgent problems or destructive actions.\n * - `accent`: Highlighted or promotional content.\n * - `custom`: Custom styling controlled by your theme.\n *\n * @default 'auto'\n */\n tone?: ToneKeyword;\n /**\n * The rendering style for numbers in the font.\n *\n * - `auto`: Inherits the setting from the parent element.\n * - `normal`: Uses the font's default numeric glyphs.\n * - `tabular-nums`: Uses fixed-width numeric glyphs, ensuring numbers align vertically in tables or lists.\n *\n * Learn more about the [font-variant-numeric property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric).\n *\n * @default 'auto'\n */\n fontVariantNumeric?: 'auto' | 'normal' | 'tabular-nums';\n /**\n * The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation.\n *\n * The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry).\n *\n * It is recommended to combine it with the `dir` attribute to ensure the text is rendered correctly if the surrounding content’s direction is different.\n *\n * @default ''\n */\n lang?: string;\n /**\n * Indicates the directionality of the element’s text.\n *\n * - `\"\"`: The direction is inherited from parent elements (equivalent to not setting the attribute).\n * - `auto`: The user agent determines the direction based on the content.\n * - `ltr`: The languages written from left to right (such as English).\n * - `rtl`: The languages written from right to left (such as Arabic).\n *\n * Learn more about the [dir attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).\n *\n * @default ''\n */\n dir?: 'ltr' | 'rtl' | 'auto' | '';\n}" + "value": "export interface ChoiceListProps\n extends Required<\n Pick<\n ChoiceListProps$1,\n | 'details'\n | 'disabled'\n | 'error'\n | 'label'\n | 'labelAccessibilityVisibility'\n | 'multiple'\n | 'name'\n | 'values'\n >\n > {}" } }, - "BlockTypographyProps": { + "ChoiceListJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BlockTypographyProps", - "description": "", + "name": "ChoiceListJSXProps", + "description": "Properties for using the choice list component in JSX with React-style event handlers.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "lineClamp", - "value": "number", - "description": "The maximum number of lines to display before truncating the text content.\n\nLearn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).", - "isOptional": true, - "defaultValue": "Infinity - no truncation is applied" - } - ], - "value": "export interface BlockTypographyProps {\n /**\n * The maximum number of lines to display before truncating the text content.\n *\n * Learn more about the [-webkit-line-clamp property](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp).\n *\n * @default Infinity - no truncation is applied\n */\n lineClamp?: number;\n}" - } - }, - "BaseImageProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "BaseImageProps", - "description": "", - "isPublicDocs": true, - "members": [ + "name": "children", + "value": "ComponentChildren", + "description": "The choices that a user can select from, provided as Choice components.\n\nAccepts Choice components.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "alt", - "value": "string", - "description": "Alternative text that describes the image for accessibility.\n\nProvides a text description of the image for users with assistive technology and serves as a fallback when the image fails to load. A well-written description enables people with visual impairments to understand non-text content.\n\nWhen a screen reader encounters an image, it reads this description aloud. When an image fails to load, this text displays on screen, helping all users understand what content was intended.\n\nLearn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).", + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.\n\n`disabled` on any child choices is ignored when this is true.", "isOptional": true, - "defaultValue": "``" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "sizes", - "value": "string", - "description": "A set of media conditions and their corresponding sizes.\n\nLearn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes).", + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "src", + "name": "id", "value": "string", - "description": "The image source (either a remote URL or a local file resource).\n\nWhen the image is loading or no `src` is provided, a placeholder is rendered.", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "srcSet", - "value": "string", - "description": "A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n\nLearn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset).", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", "isOptional": true - } - ], - "value": "export interface BaseImageProps {\n /**\n * Alternative text that describes the image for accessibility.\n *\n * Provides a text description of the image for users with assistive technology\n * and serves as a fallback when the image fails to load. A well-written description\n * enables people with visual impairments to understand non-text content.\n *\n * When a screen reader encounters an image, it reads this description aloud.\n * When an image fails to load, this text displays on screen, helping all users\n * understand what content was intended.\n *\n * Learn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4)\n * and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt).\n *\n * @default ``\n */\n alt?: string;\n /**\n * A set of media conditions and their corresponding sizes.\n *\n * Learn more about the [sizes attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#sizes).\n */\n sizes?: string;\n /**\n * The image source (either a remote URL or a local file resource).\n *\n * When the image is loading or no `src` is provided, a placeholder is rendered.\n *\n * @implementation Surfaces may choose the style of the placeholder, but the space the image occupies should be\n * reserved, except in cases where the image area does not have a contextual inline or block size, which should be rare.\n *\n * Learn more about the [src attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#src).\n */\n src?: string;\n /**\n * A set of image sources and their width or pixel density descriptors. This overrides the `src` property.\n *\n * Learn more about the [srcset attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#srcset).\n */\n srcSet?: string;\n}" - } - }, - "MoneyAutocompleteField": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "MoneyAutocompleteField", - "value": "'transaction-amount'", - "description": "Represents autocomplete values that are valid for money/currency input fields. This is a subset of `AnyAutocompleteField` containing only fields suitable for monetary inputs.", - "isPublicDocs": true - } - }, - "ParagraphType": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ParagraphType", - "value": "'paragraph' | 'small'", - "description": "", - "isPublicDocs": true - } - }, - "PaginationProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "PaginationProps", - "description": "", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "hasNextPage", - "value": "boolean", - "description": "Whether there's an additional page of data.", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "hasPreviousPage", + "name": "multiple", "value": "boolean", - "description": "Whether there's a previous page of data.", + "description": "Whether multiple choices can be selected.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "loading", - "value": "boolean", - "description": "Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table. When `true`, the table might be in an inert state that prevents user interaction.", - "isOptional": true, - "defaultValue": "false" + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onNextPage", - "value": "(event: Event) => void", - "description": "A callback fired when the next page button is clicked.", + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the selected choices change and the choice list loses focus.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onPreviousPage", - "value": "(event: Event) => void", - "description": "A callback fired when the previous page button is clicked.", + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the selected choices change as the user interacts with them.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paginate", - "value": "boolean", - "description": "Whether to use pagination controls.", - "isOptional": true, - "defaultValue": "false" + "name": "values", + "value": "string[]", + "description": "An array of the `value`s of the selected options.\n\nThis is a convenience prop for setting the `selected` prop on child options.", + "isOptional": true } ], - "value": "export interface PaginationProps {\n /**\n * Whether to use pagination controls.\n *\n * @default false\n */\n paginate?: boolean;\n /**\n * A callback fired when the previous page button is clicked.\n */\n onPreviousPage?: (event: Event) => void;\n /**\n * A callback fired when the next page button is clicked.\n */\n onNextPage?: (event: Event) => void;\n /**\n * Whether there's an additional page of data.\n *\n * @default false\n */\n hasNextPage?: boolean;\n /**\n * Whether there's a previous page of data.\n *\n * @default false\n */\n hasPreviousPage?: boolean;\n /**\n * Whether the table is in a loading state, such as during initial page load or when loading the next page in a paginated table.\n * When `true`, the table might be in an inert state that prevents user interaction.\n *\n * @default false\n */\n loading?: boolean;\n}" + "value": "export interface ChoiceListJSXProps\n extends Partial,\n Pick {\n /**\n * The choices that a user can select from, provided as Choice components.\n *\n * Accepts Choice components.\n */\n children?: ComponentChildren;\n /**\n * A callback that's triggered when the selected choices change and the choice list loses focus.\n */\n onChange?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the selected choices change as the user interacts with them.\n */\n onInput?: ((event: CallbackEvent) => void) | null;\n}" } }, - "TextType": { + "ClickableBaseProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", - "name": "TextType", - "value": "'address' | 'redundant' | 'mark' | 'emphasis' | 'offset' | 'strong' | 'small' | 'generic'", - "description": "Defines the semantic type and styling treatment for text content. Each type maps to appropriate HTML elements and applies specific styling for different contexts.", - "isPublicDocs": true - } - }, - "Key": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "Key", - "value": "string | number | any", - "description": "Represents a unique key for identifying elements in lists. Can be a string, number, or any other value.", - "isPublicDocs": true - } - }, - "RefCallback": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "RefCallback", - "description": "Represents a callback function that receives a reference to a DOM element or component instance. Called when the element is mounted or unmounted.", - "isPublicDocs": true, - "params": [ - { - "name": "instance", - "description": "", - "value": "T", - "filePath": "src/surfaces/admin/components.ts" - } - ], - "returns": { - "filePath": "src/surfaces/admin/components.ts", - "description": "", - "name": "void", - "value": "void" - }, - "value": "(instance: T | null) => void" - } - }, - "Ref": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "Ref", - "value": "RefObject | RefCallback | null", - "description": "Represents a reference to a DOM element or component instance. Can be either a ref object, callback function, or null.", - "isPublicDocs": true - } - }, - "RefObject": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "RefObject", + "name": "ClickableBaseProps", + "value": "Required<\n Pick<\n ClickableProps$1,\n | 'command'\n | 'commandFor'\n | 'interestFor'\n | 'disabled'\n | 'download'\n | 'href'\n | 'lang'\n | 'loading'\n | 'overflow'\n | 'target'\n | 'type'\n >\n>", "description": "", + "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "current", - "value": "T | null", - "description": "The current value of the ref, which holds a reference to the DOM element or component instance. Will be `null` if the element is not yet mounted or has been unmounted." - } - ], - "value": "export interface RefObject {\n /**\n * The current value of the ref, which holds a reference to the DOM element or component instance.\n * Will be `null` if the element is not yet mounted or has been unmounted.\n */\n current: T | null;\n}" - } - }, - "ComponentChild": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ComponentChild", - "value": "VNode | object | string | number | bigint | boolean | null | undefined", - "description": "Represents a single child element that can be rendered, including VNodes, primitives, or null/undefined values.", - "isPublicDocs": true - } - }, - "VNode": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "VNode", - "description": "", - "members": [ + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "endTime", - "value": "number", - "description": "The time that the rendering of this `vnode` was completed. Will only be set when the devtools are attached. Default value: `-1`", + "name": "commandFor", + "value": "string", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "key", - "value": "Key", - "description": "A unique key used to identify this element in lists for efficient reconciliation." + "name": "disabled", + "value": "boolean", + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "props", - "value": "P & { children: ComponentChildren$1; }", - "description": "The properties passed to this component or element, including children." + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "ref", - "value": "Ref | null", - "description": "A ref to the element, which is not guaranteed by React.ReactElement. For compatibility reasons with popular react libs we define it as optional too.", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "startTime", - "value": "number", - "description": "The time this `vnode` started rendering. Will only be set when the devtools are attached. Default value: `0`", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "loading", + "value": "boolean", + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "target", + "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", + "description": "Specifies where to display the linked URL.", + "isOptional": true, + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "type", - "value": "ComponentType

| string", - "description": "The component type or HTML element tag name that this VNode represents." + "value": "'submit' | 'button' | 'reset'", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "isOptional": true, + "defaultValue": "'button'" } - ], - "value": "export interface VNode

{\n /**\n * The component type or HTML element tag name that this VNode represents.\n */\n type: ComponentType

| string;\n /**\n * The properties passed to this component or element, including children.\n */\n props: P & {\n children: ComponentChildren$1;\n };\n /**\n * A unique key used to identify this element in lists for efficient reconciliation.\n */\n key: Key;\n /**\n * A ref to the element, which is not guaranteed by React.ReactElement. For compatibility reasons with popular react libs we define it as optional too.\n */\n ref?: Ref | null;\n /**\n * The time this `vnode` started rendering. Will only be set when\n * the devtools are attached.\n * Default value: `0`\n */\n startTime?: number;\n /**\n * The time that the rendering of this `vnode` was completed. Will only be\n * set when the devtools are attached.\n * Default value: `-1`\n */\n endTime?: number;\n}" - } - }, - "ComponentType": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ComponentType", - "value": "ComponentClass

| FunctionComponent

", - "description": "Represents any valid component type, either a class component or a function component.", - "isPublicDocs": true + ] } }, - "ComponentClass": { + "ClickableProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ComponentClass", - "description": "", + "name": "ClickableProps", + "description": "The properties for the clickable component. These properties define a low-level interactive container element that responds to user clicks while inheriting all box styling capabilities. The component serves as a foundation for building custom interactive components.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "contextType", - "value": "Context", - "description": "The context type this component can consume. When set, the component will have access to this context's value.", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultProps", - "value": "Partial

", - "description": "The default values for props that will be used when props are not explicitly provided to component instances.", - "isOptional": true + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "displayName", - "value": "string", - "description": "A human-readable name for this component class, used in debugging and dev tools.", - "isOptional": true + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "getDerivedStateFromError", - "value": "(error: any) => Partial", - "description": "", - "isOptional": true + "syntaxKind": "PropertySignature", + "name": "background", + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", + "defaultValue": "'transparent'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "getDerivedStateFromProps", - "value": "(props: Readonly

, state: Readonly) => Partial", - "description": "", - "isOptional": true - } - ], - "value": "export interface ComponentClass

{\n new (props: P, context?: any): Component;\n /**\n * A human-readable name for this component class, used in debugging and dev tools.\n */\n displayName?: string;\n /**\n * The default values for props that will be used when props are not explicitly provided to component instances.\n */\n defaultProps?: Partial

;\n /**\n * The context type this component can consume. When set, the component will have access to this context's value.\n */\n contextType?: Context;\n getDerivedStateFromProps?(\n props: Readonly

,\n state: Readonly,\n ): Partial | null;\n getDerivedStateFromError?(error: any): Partial | null;\n}" - } - }, - "Context": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Context", - "description": "", - "isPublicDocs": true, - "members": [ + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "Consumer", - "value": "Consumer", - "description": "A component that consumes the context value and re-renders when it changes." + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultProps", - "value": "Partial

| undefined", - "description": "The default values for props that will be used when props are not explicitly provided.", - "isOptional": true + "name": "borderColor", + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultValue", - "value": "T", - "description": "The default value for this context, used when no Provider is found in the component tree." + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "displayName", - "value": "string", - "description": "A human-readable name for this context, used in debugging and dev tools.", - "isOptional": true + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "Provider", - "value": "Provider", - "description": "A component that provides the context value to its descendants." - } - ], - "value": "export interface Context {\n /**\n * The default value for this context, used when no Provider is found in the component tree.\n */\n readonly defaultValue: T;\n}" - } - }, - "Consumer": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Consumer", - "description": "", - "members": [ + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", + "defaultValue": "'' - meaning no override" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultProps", - "value": "Partial

| undefined", - "description": "The default values for props that will be used when props are not explicitly provided.", - "isOptional": true + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "displayName", + "name": "commandFor", "value": "string", - "description": "A human-readable name for this component, used in debugging and dev tools.", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", "isOptional": true - } - ], - "value": "export interface Consumer\n extends FunctionComponent<{\n /**\n * A render function that receives the current context value and returns elements to render.\n * This function is called whenever the context value changes, allowing components to re-render with the updated value.\n */\n children: (value: T) => ComponentChildren$1;\n }> {}" - } - }, - "Provider": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Provider", - "description": "", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultProps", - "value": "Partial

| undefined", - "description": "The default values for props that will be used when props are not explicitly provided.", - "isOptional": true + "name": "disabled", + "value": "boolean", + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "displayName", + "name": "display", + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "download", "value": "string", - "description": "A human-readable name for this component, used in debugging and dev tools.", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", "isOptional": true - } - ], - "value": "export interface Provider\n extends FunctionComponent<{\n /**\n * The context value to provide to consuming components.\n */\n value: T;\n /**\n * The child components that will have access to this context value.\n */\n children?: ComponentChildren$1;\n }> {}" - } - }, - "FunctionComponent": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "FunctionComponent", - "description": "", - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultProps", - "value": "Partial

| undefined", - "description": "The default values for props that will be used when props are not explicitly provided.", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "displayName", + "name": "inlineSize", + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", "value": "string", - "description": "A human-readable name for this component, used in debugging and dev tools.", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true - } - ], - "value": "export interface FunctionComponent

{\n (props: RenderableProps

, context?: any): ComponentChildren$1;\n /**\n * A human-readable name for this component, used in debugging and dev tools.\n */\n displayName?: string;\n /**\n * The default values for props that will be used when props are not explicitly provided.\n */\n defaultProps?: Partial

| undefined;\n}" - } - }, - "ErrorInfo": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ErrorInfo", - "description": "", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "componentStack", + "name": "lang", "value": "string", - "description": "A string representation of the component stack trace at the point where an error occurred. Useful for debugging to understand which components were rendering when the error happened.", - "isOptional": true - } - ], - "value": "export interface ErrorInfo {\n /**\n * A string representation of the component stack trace at the point where an error occurred.\n * Useful for debugging to understand which components were rendering when the error happened.\n */\n componentStack?: string;\n}" - } - }, - "RenderableProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RenderableProps", - "value": "P & Readonly<\n Attributes & {\n /**\n * The child elements to be rendered within this component.\n */\n children?: ComponentChildren$1;\n /**\n * A reference to the DOM element or component instance, allowing direct access to the underlying element.\n */\n ref?: Ref;\n }\n >", - "description": "Represents the props that can be rendered by a component, combining custom props with standard attributes like children and ref.", - "isPublicDocs": true - } - }, - "Attributes": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Attributes", - "description": "", - "members": [ + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", + "isOptional": true, + "defaultValue": "''" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "jsx", - "value": "boolean | undefined", - "description": "An internal flag indicating whether this element was created using JSX syntax.", - "isOptional": true + "name": "loading", + "value": "boolean", + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "key", - "value": "Key | undefined", - "description": "A unique key used to identify this element in lists for efficient reconciliation during re-renders.", - "isOptional": true - } - ], - "value": "export interface Attributes {\n /**\n * A unique key used to identify this element in lists for efficient reconciliation during re-renders.\n */\n key?: Key | undefined;\n /**\n * An internal flag indicating whether this element was created using JSX syntax.\n */\n jsx?: boolean | undefined;\n}" - } - }, - "Component": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Component", - "description": "", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "state", - "value": "Readonly", - "description": "The current state of the component." + "name": "maxBlockSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "props", - "value": "RenderableProps", - "description": "The props passed to this component." + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "context", - "value": "any", - "description": "The context value this component can access if a contextType is specified." + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "base", - "value": "Element | Text", - "description": "The underlying DOM element or text node that this component rendered." + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setState", - "value": "(state: Partial | ((prevState: Readonly, props: Readonly

) => Partial | Pick) | Pick, callback?: () => void) => void", - "description": "" + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "forceUpdate", - "value": "(callback?: () => void) => void", - "description": "" + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "MaybeResponsive>", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "render", - "value": "(props?: RenderableProps, state?: Readonly, context?: any) => ComponentChildren$1", - "description": "" - } - ], - "value": "declare abstract class Component {\n constructor(props?: P, context?: any);\n static displayName?: string;\n static defaultProps?: any;\n static contextType?: Context;\n // Static members cannot reference class type parameters. This is not\n // supported in TypeScript. Reusing the same type arguments from `Component`\n // will lead to an impossible state where one cannot satisfy the type\n // constraint under no circumstances, see #1356.In general type arguments\n // seem to be a bit buggy and not supported well at the time of this\n // writing with TS 3.3.3333.\n static getDerivedStateFromProps?(\n props: Readonly,\n state: Readonly,\n ): object | null;\n\n static getDerivedStateFromError?(error: any): object | null;\n /**\n * The current state of the component.\n */\n state: Readonly;\n /**\n * The props passed to this component.\n */\n props: RenderableProps

;\n /**\n * The context value this component can access if a contextType is specified.\n */\n context: any;\n /**\n * The underlying DOM element or text node that this component rendered.\n */\n base?: Element | Text;\n // From https://github.com/DefinitelyTyped/DefinitelyTyped/blob/e836acc75a78cf0655b5dfdbe81d69fdd4d8a252/types/react/index.d.ts#L402\n // // We MUST keep setState() as a unified signature because it allows proper checking of the method return type.\n // // See: https://github.com/DefinitelyTyped/DefinitelyTyped/issues/18365#issuecomment-351013257\n setState(\n state:\n | ((\n prevState: Readonly,\n props: Readonly

,\n ) => Pick | Partial | null)\n | (Pick | Partial | null),\n callback?: () => void,\n ): void;\n\n forceUpdate(callback?: () => void): void;\n abstract render(\n props?: RenderableProps

,\n state?: Readonly,\n context?: any,\n ): ComponentChildren$1;\n}" - } - }, - "Styles": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "Styles", - "value": "string", - "description": "Represents CSS styles as a string, typically used for inline styles or style injection.", - "isPublicDocs": true - } - }, - "RenderImpl": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RenderImpl", - "value": "Omit & {\n ShadowRoot: (element: any) => ComponentChildren;\n styles?: Styles;\n}", - "description": "Represents the implementation details for rendering components within a shadow DOM. Extends `ShadowRootInit` with a render function and optional styles.", - "isPublicDocs": true - } - }, - "CallbackEvent": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "CallbackEvent", - "value": "Event & {\n currentTarget: HTMLElementTagNameMap[T];\n}", - "description": "An event object with a strongly-typed `currentTarget` property that references the specific HTML element that triggered the event.\n\nThis type extends the standard DOM `Event` interface and ensures type safety when accessing the element that fired the event.", - "isPublicDocs": true - } - }, - "CallbackToggleEvent": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "CallbackToggleEvent", - "value": "TEvent & {\n currentTarget: HTMLElementTagNameMap[TTagName];\n}", - "description": "A toggle event with a strongly-typed `currentTarget` property. Extends the `ToggleEvent` interface with type-safe access to the element that triggered the toggle.", - "isPublicDocs": true - } - }, - "CallbackEventListener": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "CallbackEventListener", - "value": "(EventListener & {\n (event: CallbackEvent): void;\n }) | null", - "description": "A function that handles events from UI components.\n\nThis type represents an event listener callback that receives a `CallbackEvent` with a strongly-typed `currentTarget`. Use this for component event handlers like `click`, `focus`, `blur`, and other DOM events.", - "isPublicDocs": true - } - }, - "CallbackErrorEventListener": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "CallbackErrorEventListener", - "value": "(EventListener & {\n (\n event: CallbackEvent & {\n error: TError;\n },\n ): void;\n }) | null", - "description": "A function that handles error events from UI components. This type represents an event listener callback that receives both the event and an error object.", - "isPublicDocs": true - } - }, - "CallbackExtendableEventListener": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "CallbackExtendableEventListener", - "value": "(EventListener & {\n (event: CallbackExtendableEvent): void;\n }) | null", - "description": "A function that handles extendable events from UI components. This type represents an event listener callback that can use `waitUntil` to extend the event lifetime.", - "isPublicDocs": true - } - }, - "CallbackExtendableEvent": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "CallbackExtendableEvent", - "description": "", - "members": [ + "syntaxKind": "PropertySignature", + "name": "paddingBlock", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "AT_TARGET", - "value": "2", - "description": "" + "name": "paddingBlockEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "bubbles", - "value": "boolean", - "description": "The **`bubbles`** read-only property of the Event interface indicates whether the event bubbles up through the DOM tree or not.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/bubbles)" + "name": "paddingBlockStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "BUBBLING_PHASE", - "value": "3", - "description": "" + "name": "paddingInline", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "cancelable", - "value": "boolean", - "description": "The **`cancelable`** read-only property of the Event interface indicates whether the event can be canceled, and therefore prevented as if the event never happened.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelable)" + "name": "paddingInlineEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "cancelBubble", - "value": "boolean", - "description": "The **`cancelBubble`** property of the Event interface is deprecated.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelBubble)" + "name": "paddingInlineStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "CAPTURING_PHASE", - "value": "1", - "description": "" + "name": "target", + "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", + "description": "Specifies where to display the linked URL.", + "isOptional": true, + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "composed", - "value": "boolean", - "description": "The read-only **`composed`** property of the or not the event will propagate across the shadow DOM boundary into the standard DOM.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composed)" - }, + "name": "type", + "value": "'submit' | 'button' | 'reset'", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "isOptional": true, + "defaultValue": "'button'" + } + ], + "value": "export interface ClickableProps\n extends Required,\n ClickableBaseProps {}" + } + }, + "ClickableJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ClickableJSXProps", + "description": "The JSX properties for the clickable component. These properties define how a clickable container is rendered in Preact or JSX.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "composedPath", - "value": "() => EventTarget[]", - "description": "The **`composedPath()`** method of the Event interface returns the event's path which is an array of the objects on which listeners will be invoked.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composedPath)" + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "currentTarget", - "value": "EventTarget | null", - "description": "The **`currentTarget`** read-only property of the Event interface identifies the element to which the event handler has been attached.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/currentTarget)" + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultPrevented", - "value": "boolean", - "description": "The **`defaultPrevented`** read-only property of the Event interface returns a boolean value indicating whether or not the call to Event.preventDefault() canceled the event.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/defaultPrevented)" + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "eventPhase", - "value": "number", - "description": "The **`eventPhase`** read-only property of the being evaluated.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/eventPhase)" + "name": "background", + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", + "defaultValue": "'transparent'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "initEvent", - "value": "(type: string, bubbles?: boolean, cancelable?: boolean) => void", - "description": "The **`Event.initEvent()`** method is used to initialize the value of an event created using Document.createEvent().", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/initEvent)" + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "isTrusted", - "value": "boolean", - "description": "The **`isTrusted`** read-only property of the when the event was generated by the user agent (including via user actions and programmatic methods such as HTMLElement.focus()), and `false` when the event was dispatched via The only exception is the `click` event, which initializes the `isTrusted` property to `false` in user agents.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/isTrusted)" + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "NONE", - "value": "0", - "description": "" + "name": "borderColor", + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "preventDefault", - "value": "() => void", - "description": "The **`preventDefault()`** method of the Event interface tells the user agent that if the event does not get explicitly handled, its default action should not be taken as it normally would be.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/preventDefault)" + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "returnValue", - "value": "boolean", - "description": "The Event property **`returnValue`** indicates whether the default action for this event has been prevented or not.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/returnValue)" + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "srcElement", - "value": "EventTarget | null", - "description": "The deprecated **`Event.srcElement`** is an alias for the Event.target property.", - "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/srcElement)" + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "stopImmediatePropagation", - "value": "() => void", - "description": "The **`stopImmediatePropagation()`** method of the If several listeners are attached to the same element for the same event type, they are called in the order in which they were added.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopImmediatePropagation)" + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content to display inside the component. This can include text, components, or any other UI elements.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodSignature", - "name": "stopPropagation", - "value": "() => void", - "description": "The **`stopPropagation()`** method of the Event interface prevents further propagation of the current event in the capturing and bubbling phases.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopPropagation)" + "syntaxKind": "PropertySignature", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "target", - "value": "EventTarget | null", - "description": "The read-only **`target`** property of the dispatched.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/target)" + "name": "commandFor", + "value": "string", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "timeStamp", - "value": "DOMHighResTimeStamp", - "description": "The **`timeStamp`** read-only property of the Event interface returns the time (in milliseconds) at which the event was created.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/timeStamp)" + "name": "disabled", + "value": "boolean", + "description": "Disables the clickable, meaning it cannot be clicked or receive focus.\n\nIn this state, onClick will not fire. If the click event originates from a child element, the event will immediately stop propagating from this element.\n\nHowever, items within the clickable can still receive focus and be interacted with.\n\nThis has no impact on the visual state by default, but developers are encouraged to style the clickable accordingly.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "type", - "value": "string", - "description": "The **`type`** read-only property of the Event interface returns a string containing the event's type.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/type)" + "name": "display", + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "waitUntil", - "value": "(promise: Promise) => void", - "description": "A method that accepts a promise signaling the duration and eventual success or failure of event-related actions.\n\nCan be called multiple times to add promises to the event, but must be called synchronously during event dispatch. Cannot be called after a `setTimeout` or within a microtask.", + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", "isOptional": true - } - ], - "value": "export interface CallbackExtendableEvent<\n TTagName extends keyof HTMLElementTagNameMap,\n> extends CallbackEvent,\n Pick {}" - } - }, - "PreactBaseElementProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "PreactBaseElementProps", - "description": "Base props for Preact custom elements without children support. Includes common properties like key, ref, and slot for elements that don't accept child content.", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "key", - "value": "preact.Key", - "description": "A unique identifier for this element, used by the virtual DOM to efficiently track and update elements in lists. Essential for maintaining component state and optimizing re-renders when lists change.", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "ref", - "value": "preact.Ref", - "description": "A reference to access the underlying DOM element directly. Typically created using `useRef()` to interact with the element imperatively or measure its properties.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "slot", - "value": "Lowercase", - "description": "The named slot to which this element is assigned in the parent component's shadow DOM.\n\nUsed for advanced component composition with web components.", - "isOptional": true - } - ], - "value": "export interface PreactBaseElementProps {\n /**\n * A unique identifier for this element, used by the virtual DOM to efficiently track and update elements in lists.\n * Essential for maintaining component state and optimizing re-renders when lists change.\n */\n key?: preact.Key;\n /**\n * A reference to access the underlying DOM element directly.\n * Typically created using `useRef()` to interact with the element imperatively or measure its properties.\n */\n ref?: preact.Ref;\n /**\n * The named slot to which this element is assigned in the parent component's shadow DOM.\n *\n * Used for advanced component composition with web components.\n */\n slot?: Lowercase;\n}" - } - }, - "PreactBaseElementPropsWithChildren": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "PreactBaseElementPropsWithChildren", - "description": "Base props for Preact custom elements with children support. Extends PreactBaseElementProps with the ability to render child elements.", - "isPublicDocs": true, - "members": [ + "name": "inlineSize", + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", + "defaultValue": "'auto'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "preact.ComponentChildren", - "description": "The child elements to be rendered within this component.", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "key", - "value": "preact.Key", - "description": "A unique identifier for this element, used by the virtual DOM to efficiently track and update elements in lists. Essential for maintaining component state and optimizing re-renders when lists change.", - "isOptional": true + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", + "isOptional": true, + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "ref", - "value": "preact.Ref", - "description": "A reference to access the underlying DOM element directly. Typically created using `useRef()` to interact with the element imperatively or measure its properties.", - "isOptional": true + "name": "loading", + "value": "boolean", + "description": "Disables the clickable, and indicates to assistive technology that the loading is in progress.\n\nThis also disables the clickable.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "slot", - "value": "Lowercase", - "description": "The named slot to which this element is assigned in the parent component's shadow DOM.\n\nUsed for advanced component composition with web components.", + "name": "maxBlockSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback function that's invoked when the component loses focus. It receives the blur event as an argument.", "isOptional": true - } - ], - "value": "export interface PreactBaseElementPropsWithChildren\n extends PreactBaseElementProps {\n /**\n * The child elements to be rendered within this component.\n */\n children?: preact.ComponentChildren;\n}" - } - }, - "RequiredBannerProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RequiredBannerProps", - "value": "Required", - "description": "Represents the banner component props with all properties marked as required.", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The main message content displayed within the banner, providing important information or guidance to users.", + "name": "onClick", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback function that's invoked when the component is clicked. It receives the click event as an argument.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "collapsible", - "value": "boolean", - "description": "Whether the banner content can be collapsed. When true, child elements are initially hidden but can be revealed by the user expanding the banner.", - "isOptional": true, - "defaultValue": "false" + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback function that's invoked when the component receives focus. It receives the focus event as an argument.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "dismissible", - "value": "boolean", - "description": "Whether the banner displays a close button that allows users to dismiss it.\n\nWhen the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, any animation completes, and the `afterhide` event fires.", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "heading", - "value": "string", - "description": "The heading text displayed at the top of the banner.", - "isOptional": true, - "defaultValue": "''" + "name": "padding", + "value": "MaybeResponsive>", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "hidden", - "value": "boolean", - "description": "Controls whether the banner is visible or hidden.\n\nWhen using a controlled component pattern and the banner is `dismissible`, update this property to `true` when the `dismiss` event fires.\n\nYou can hide the banner programmatically by setting this to `true` even if it's not `dismissible`.", - "isOptional": true, - "defaultValue": "false" + "name": "paddingBlock", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", - "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", - "isOptional": true + "name": "paddingBlockEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onAfterHide", - "value": "(event: Event) => void", - "description": "A callback fired when the banner has fully hidden, including after any hide animations have completed.\n\nThe `hidden` property will be `true` when this event fires.", - "isOptional": true + "name": "paddingBlockStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onDismiss", - "value": "(event: Event) => void", - "description": "A callback fired when the banner is dismissed by the user clicking the close button. Does not fire when setting `hidden` manually.\n\nThe `hidden` property is `false` when this event fires.", - "isOptional": true + "name": "paddingInline", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "primaryAction", - "value": "ComponentChildren", - "description": "The primary action button or link, representing the main or most important action available in this context. Typically displayed with higher visual prominence than secondary actions to establish clear hierarchy.", - "isOptional": true + "name": "paddingInlineEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondaryActions", - "value": "ComponentChildren", - "description": "Additional action buttons or links that provide alternative or supporting actions. Visually de-emphasized compared to the primary action.", - "isOptional": true + "name": "paddingInlineStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "tone", - "value": "ToneKeyword", - "description": "The semantic meaning and color treatment of the component.\n\n- `info`: Informational content or helpful tips.\n- `success`: Positive outcomes or successful states.\n- `warning`: Important warnings about potential issues.\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.", + "name": "target", + "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", + "description": "Specifies where to display the linked URL.", "isOptional": true, "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "type", + "value": "'submit' | 'button' | 'reset'", + "description": "The behavior of the Button.\n\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "isOptional": true, + "defaultValue": "'button'" } - ] - } - }, - "MakeResponsive": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "MakeResponsive", - "value": "T | `@container${string}`", - "description": "Makes a type responsive by allowing it to be either the base value or a container query string. This enables conditional styling based on container dimensions.", - "isPublicDocs": true - } - }, - "MakeResponsivePick": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "MakeResponsivePick", - "value": "{\n [P in TProperty]: MakeResponsive;\n}", - "description": "Makes a property's value potentially responsive.", - "isPublicDocs": true + ], + "value": "export interface ClickableJSXProps\n extends Partial,\n Pick {\n /**\n * The content to display inside the component. This can include text, components, or any other UI elements.\n */\n children?: ComponentChildren;\n /**\n * A callback function that's invoked when the component is clicked. It receives the click event as an argument.\n */\n onClick?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback function that's invoked when the component receives focus. It receives the focus event as an argument.\n */\n onFocus?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback function that's invoked when the component loses focus. It receives the blur event as an argument.\n */\n onBlur?: ((event: CallbackEvent) => void) | null;\n}" } }, - "RequiredBoxProps": { + "ClickableChipProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RequiredBoxProps", - "value": "Required", - "description": "Represents the box component props with all properties marked as required.", + "name": "ClickableChipProps", + "description": "The properties for the clickable chip component. These properties define an interactive chip that can be clicked or removed.", "isPublicDocs": true, "members": [ { @@ -16632,544 +17838,650 @@ "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityRole", - "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "name": "color", + "value": "ColorKeyword", + "description": "Modify the color to be more or less intense.", "isOptional": true, - "defaultValue": "'generic'" + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityVisibility", - "value": "'visible' | 'hidden' | 'exclusive'", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", "isOptional": true, - "defaultValue": "'visible'" + "defaultValue": "'--auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "background", - "value": "BackgroundColorKeyword", - "description": "The background color of the element. Use `transparent` for no background, `subdued` for a subtle background, `base` for standard background, or `strong` for a prominent background.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isOptional": true, - "defaultValue": "'transparent'" + "name": "commandFor", + "value": "string", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blockSize", - "value": "MaybeResponsive", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about the [block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", + "name": "disabled", + "value": "boolean", + "description": "Disables the chip, disallowing any interaction.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "border", - "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.\n\nAccepts a size value, optionally followed by a color, optionally followed by a style. Omitted values use defaults: color defaults to `base`, style defaults to `auto`.\n\nIndividual properties (`borderWidth`, `borderStyle`, `borderColor`) can override values set here.", + "name": "hidden", + "value": "boolean", + "description": "Determines whether the chip is hidden.\n\nIf this property is being set on each framework render (as in 'controlled' usage), and the chip is `removable`, ensure you update app state for this property when the `remove` event fires.\n\nIf the chip is not `removable`, it can still be hidden by setting this property.", "isOptional": true, - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderColor", - "value": "ColorKeyword | ''", - "description": "The color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- One value: applies to all corners\n- Two values: applies to start corners (top-left & bottom-right) and end corners (top-right & bottom-left) respectively\n- Three values: applies to start-start (top-left), end corners (top-right & bottom-left), and end-end (bottom-right) respectively\n- Four values: applies to start-start (top-left), start-end (top-right), end-end (bottom-right), and end-start (bottom-left) respectively\n\nExamples:\n- `small-100`: All corners have `small-100` radius\n- `small-100 none`: Top-left and bottom-right are `small-100`, top-right and bottom-left are `none`\n- `small-100 none large-100`: Top-left is `small-100`, top-right and bottom-left are `none`, bottom-right is `large-100`\n- `small-100 none large-100 base`: Each corner has its specified radius value", - "isOptional": true, - "defaultValue": "'none'" + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderStyle", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted.\n\nWhen set, this overrides the style value specified in the `border` property.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different styles per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", "isOptional": true, - "defaultValue": "'' - meaning no override" - }, + "defaultValue": "false" + } + ], + "value": "export interface ClickableChipProps\n extends Required<\n Pick<\n ClickableChipProps$1,\n | 'color'\n | 'accessibilityLabel'\n | 'removable'\n | 'hidden'\n | 'href'\n | 'disabled'\n | 'command'\n | 'commandFor'\n | 'interestFor'\n >\n > {}" + } + }, + "ClickableChipJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ClickableChipJSXProps", + "description": "The JSX properties for the clickable chip component. These properties define how a clickable chip is rendered in Preact or JSX.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderWidth", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Chip. It will be read to users using assistive technologies such as screen readers.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", "value": "ComponentChildren", - "description": "The content displayed within the box component, which serves as a flexible container for organizing and styling other components.", + "description": "The content of the chip.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "display", - "value": "MaybeResponsive<'auto' | 'none'>", - "description": "The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n\nLearn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).", + "name": "color", + "value": "ColorKeyword", + "description": "Modify the color to be more or less intense.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "commandFor", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "inlineSize", - "value": "MaybeResponsive", - "description": "The horizontal size of the element in standard layouts (width in left-to-right or right-to-left writing modes).\n\nInline size adjusts based on the writing direction: in horizontal layouts, it controls the width; in vertical layouts, it controls the height. This ensures consistent behavior across different text directions.\n\nLearn more about the [inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", + "name": "disabled", + "value": "boolean", + "description": "Disables the chip, disallowing any interaction.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxBlockSize", - "value": "MaybeResponsive", - "description": "The maximum vertical size of the element in standard layouts (max-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the block axis.\n\nLearn more about the [max-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", - "isOptional": true, - "defaultValue": "'none'" + "name": "graphic", + "value": "ComponentChildren", + "description": "An optional icon to display at the start of the chip. Accepts only Icon components.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxInlineSize", - "value": "MaybeResponsive", - "description": "The maximum horizontal size of the element in standard layouts (max-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the inline axis.\n\nLearn more about the [max-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "name": "hidden", + "value": "boolean", + "description": "Determines whether the chip is hidden.\n\nIf this property is being set on each framework render (as in 'controlled' usage), and the chip is `removable`, ensure you update app state for this property when the `remove` event fires.\n\nIf the chip is not `removable`, it can still be hidden by setting this property.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minBlockSize", - "value": "MaybeResponsive", - "description": "The minimum vertical size of the element in standard layouts (min-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the block axis.\n\nLearn more about the [min-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", - "isOptional": true, - "defaultValue": "'0'" + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minInlineSize", - "value": "MaybeResponsive", - "description": "The minimum horizontal size of the element in standard layouts (min-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the inline axis.\n\nLearn more about the [min-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", - "isOptional": true, - "defaultValue": "'0'" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "overflow", - "value": "'hidden' | 'visible'", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", - "isOptional": true, - "defaultValue": "'visible'" + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "padding", - "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding.", - "isOptional": true, - "defaultValue": "'none'" + "name": "onAfterHide", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired after the chip finishes hiding.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlock", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "onClick", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired when the chip is clicked.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockEnd", - "value": "MaybeResponsive", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "onRemove", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired when the chip is removed.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockStart", - "value": "MaybeResponsive", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`.", + "name": "removable", + "value": "boolean", + "description": "Whether the chip is removable.", "isOptional": true, - "defaultValue": "'' - meaning no override" - }, + "defaultValue": "false" + } + ], + "value": "export interface ClickableChipJSXProps\n extends Partial,\n Pick {\n /**\n * The content of the chip.\n */\n children?: ComponentChildren;\n /**\n * An optional icon to display at the start of the chip. Accepts only Icon components.\n */\n graphic?: ComponentChildren;\n /**\n * A callback that's fired when the chip is clicked.\n */\n onClick?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's fired when the chip is removed.\n */\n onRemove?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's fired after the chip finishes hiding.\n */\n onAfterHide?: ((event: CallbackEvent) => void) | null;\n}" + } + }, + "ColorFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "ColorFieldProps", + "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required>", + "description": "The properties for the color field component. These properties configure an input field that allows merchants to select colors using an integrated visual color picker with text input, hex color format, and optional alpha (transparency) channel support.", + "isPublicDocs": true + } + }, + "PreactFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "PreactFieldProps", + "value": "PreactInputProps & Required<\n Pick<\n TextFieldProps$1,\n | 'defaultValue'\n | 'details'\n | 'error'\n | 'label'\n | 'labelAccessibilityVisibility'\n | 'placeholder'\n | 'readOnly'\n | 'required'\n >\n > & {\n /**\n * A hint as to the intended content of the field.\n *\n * When set to `on` (the default), this property indicates that the field should support\n * autofill, but you do not have any more semantic information on the intended\n * contents.\n *\n * When set to `off`, you are indicating that this field contains sensitive\n * information, or contents that are never saved, like one-time codes.\n *\n * Alternatively, you can provide value which describes the\n * specific data you would like to be entered into this field during autofill.\n *\n * @see Learn more about the set of {@link https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens|autocomplete values} supported in browsers.\n *\n * @default 'tel' for PhoneField\n * @default 'email' for EmailField\n * @default 'url' for URLField\n * @default 'on' for everything else\n */\n autocomplete: Autocomplete;\n }", + "description": "" + } + }, + "PreactInputProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "PreactInputProps", + "value": "Required<\n Pick\n>", + "description": "", + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInline", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`.", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineEnd", - "value": "MaybeResponsive", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineStart", - "value": "MaybeResponsive", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", + "isOptional": true } ] } }, - "ResponsiveBoxProps": { + "TextFieldProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", - "name": "ResponsiveBoxProps", - "value": "MakeResponsivePick<\n RequiredBoxProps,\n | 'padding'\n | 'paddingBlock'\n | 'paddingBlockStart'\n | 'paddingBlockEnd'\n | 'paddingInline'\n | 'paddingInlineStart'\n | 'paddingInlineEnd'\n | 'display'\n>", - "description": "Represents box props with responsive capabilities for layout properties.\n\nThis enables conditional styling based on container queries.", + "name": "TextFieldProps", + "value": "PreactFieldProps<\n /** @default 'on' */\n Required['autocomplete']\n> & Required<\n Pick<\n TextFieldProps$1,\n 'icon' | 'maxLength' | 'minLength' | 'prefix' | 'suffix'\n >\n >", + "description": "The properties for the text field component. Extends `PreactFieldProps` with text-specific features like icons, length constraints, and prefix/suffix content.", + "isPublicDocs": true + } + }, + "ColorFieldJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ColorFieldJSXProps", + "description": "The JSX props for the color field component. These properties extend `ColorFieldProps` with JSX-specific event callbacks for React-style event handling when used in Preact, including callbacks for color changes as the merchant interacts with the picker.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "display", - "value": "MaybeResponsive<'auto' | 'none'>", - "description": "The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n\nLearn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).", + "name": "alpha", + "value": "boolean", + "description": "Allow user to select an alpha value.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "padding", - "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding.", - "isOptional": true, - "defaultValue": "'none'" + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlock", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockEnd", - "value": "MaybeResponsive", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockStart", - "value": "MaybeResponsive", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`.", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInline", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineEnd", - "value": "MaybeResponsive", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineStart", - "value": "MaybeResponsive", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`.", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "'' - meaning no override" - } - ] - } - }, - "ButtonOnlyProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ButtonOnlyProps", - "value": "", - "description": "Represents button props that are specific to button-type elements only. Extracts the subset of `ButtonProps` that includes the `type` property.", - "isPublicDocs": true, - "members": [ + "defaultValue": "'visible'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityLabel", + "name": "name", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The label text or elements displayed inside the button component, describing the action that will be performed when clicked.", + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", - "isOptional": true, - "defaultValue": "'--auto'" + "name": "onChange", + "value": "(event: CallbackEvent<\"s-color-field\">) => void", + "description": "A callback that's triggered when the color value changes and the field loses focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onInput", + "value": "(event: CallbackEvent<\"s-color-field\">) => void", + "description": "A callback that's triggered when the color value changes as the user interacts with the picker.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", + "name": "readOnly", "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "download", - "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", - "isOptional": true + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "href", + "name": "value", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true - }, + } + ], + "value": "export interface ColorFieldJSXProps\n extends Partial>,\n Pick,\n FieldReactProps,\n FieldSlotInternalReactProps {\n /**\n * A callback that's triggered when the color value changes as the user interacts with the picker.\n */\n onInput?: (event: CallbackEvent) => void;\n /**\n * A callback that's triggered when the color value changes and the field loses focus.\n */\n onChange?: (event: CallbackEvent) => void;\n}" + } + }, + "ColorPickerProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ColorPickerProps", + "description": "Properties for rendering a color picker that provides a visual interface for selecting colors with optional transparency control.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "icon", - "value": "IconType | AnyString", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier.", + "name": "alpha", + "value": "boolean", + "description": "Allow user to select an alpha value.", "isOptional": true, - "defaultValue": "''" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", + "name": "defaultValue", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "inlineSize", - "value": "'auto' | 'fill' | 'fit-content'", - "description": "The displayed inline width of the button.\n\n- `auto`: the size of the button depends on the surface and context.\n- `fill`: the button will takes up 100% of the available inline size.\n- `fit-content`: the button will take up the minimum inline-size required to fit its content.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", + "name": "name", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "lang", + "name": "value", "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry).", + "description": "The currently selected color.\n\nSupported formats include:\n- HSL", "isOptional": true - }, + } + ], + "value": "export interface ColorPickerProps\n extends Required<\n Pick\n > {}" + } + }, + "ColorPickerJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ColorPickerJSXProps", + "description": "The JSX props interface for the color picker component when used in React/Preact.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "loading", + "name": "alpha", "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", + "description": "Allow user to select an alpha value.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onBlur", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onClick", - "value": "(event: Event) => void", - "description": "A callback fired when the button is activated, before performing the action indicated by `type`. Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onFocus", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "target", - "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", - "isOptional": true, - "defaultValue": "'auto'" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "tone", - "value": "ToneKeyword", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "onChange", + "value": "(event: CallbackEvent<\"s-color-picker\">) => void", + "description": "A callback that's triggered when the selected color changes and the picker loses focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "type", - "value": "'submit' | 'button' | 'reset'", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", - "isOptional": true, - "defaultValue": "'button'" + "name": "onInput", + "value": "(event: CallbackEvent<\"s-color-picker\">) => void", + "description": "A callback that's triggered when the selected color changes as the user interacts with the picker.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "variant", - "value": "'auto' | 'primary' | 'secondary' | 'tertiary'", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "value", + "value": "string", + "description": "The currently selected color.\n\nSupported formats include:\n- HSL", + "isOptional": true } - ] + ], + "value": "export interface ColorPickerJSXProps\n extends Partial,\n Pick<\n ColorPickerProps$1,\n 'id' | 'alpha' | 'value' | 'defaultValue' | 'name'\n > {\n /**\n * A callback that's triggered when the selected color changes as the user interacts with the picker.\n */\n onInput?: (event: CallbackEvent) => void | null;\n /**\n * A callback that's triggered when the selected color changes and the picker loses focus.\n */\n onChange?: (event: CallbackEvent) => void | null;\n}" } }, - "ButtonBaseProps": { + "DateFieldProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ButtonBaseProps", - "value": "Required<\n Pick<\n ButtonOnlyProps,\n | 'accessibilityLabel'\n | 'disabled'\n | 'command'\n | 'commandFor'\n | 'icon'\n | 'interestFor'\n | 'lang'\n | 'loading'\n | 'type'\n | 'tone'\n | 'variant'\n | 'target'\n | 'href'\n | 'download'\n >\n>", - "description": "Represents the base button props with all properties marked as required.", + "name": "DateFieldProps", + "description": "The properties for the date field component. These properties configure an input field that allows merchants to select dates using an integrated calendar picker with optional text input, date constraints, and day-of-week restrictions.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityLabel", + "name": "allow", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", - "isOptional": true + "description": "Dates that can be selected.\n\nA comma-separated list of dates, date ranges. Whitespace is allowed after commas.\n\nThe default `''` allows all dates.\n\n- Dates in `YYYY-MM-DD` format allow a single date.\n- Dates in `YYYY-MM` format allow a whole month.\n- Dates in `YYYY` format allow a whole year.\n- Ranges are expressed as `start--end`. - Ranges are inclusive.\n - If either `start` or `end` is omitted, the range is unbounded in that direction.\n - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.\n So `2024--` is equivalent to `2024-01-01--`.\n - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.\n So `--2024` is equivalent to `--2024-12-31`.\n - Whitespace is allowed either side of `--`.", + "isOptional": true, + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", + "name": "allowDays", + "value": "string", + "description": "Days of the week that can be selected. These intersect with the result of `allow` and `disallow`.\n\nA comma-separated list of days. Whitespace is allowed after commas.\n\nThe default `''` has no effect on the result of `allow` and `disallow`.\n\nDays are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.", "isOptional": true, - "defaultValue": "'--auto'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultView", "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", + "description": "Default month to display in `YYYY-MM` format.\n\nThis value is used until `view` is set, either directly or as a result of user interaction.\n\nDefaults to the current month in the user's locale.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", "isOptional": true }, { @@ -17177,992 +18489,1098 @@ "syntaxKind": "PropertySignature", "name": "disabled", "value": "boolean", - "description": "Whether the button is disabled, preventing it from being clicked or receiving focus.", + "description": "Disables the field, disallowing any interaction.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "download", + "name": "disallow", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", - "isOptional": true + "description": "Dates that cannot be selected. These subtract from `allow`.\n\nA comma-separated list of dates, date ranges. Whitespace is allowed after commas.\n\nThe default `''` has no effect on `allow`.\n\n- Dates in `YYYY-MM-DD` format disallow a single date.\n- Dates in `YYYY-MM` format disallow a whole month.\n- Dates in `YYYY` format disallow a whole year.\n- Ranges are expressed as `start--end`. - Ranges are inclusive.\n - If either `start` or `end` is omitted, the range is unbounded in that direction.\n - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.\n So `2024--` is equivalent to `2024-01-01--`.\n - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.\n So `--2024` is equivalent to `--2024-12-31`.\n - Whitespace is allowed either side of `--`.", + "isOptional": true, + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "href", + "name": "disallowDays", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", - "isOptional": true + "description": "Days of the week that cannot be selected. This subtracts from `allowDays`, and intersects with the result of `allow` and `disallow`.\n\nA comma-separated list of days. Whitespace is allowed after commas.\n\nThe default `''` has no effect on `allowDays`.\n\nDays are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.", + "isOptional": true, + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "icon", - "value": "IconType | AnyString", - "description": "An icon displayed inside the button, typically positioned before the button text. Use icons to help users quickly identify the button's action or to improve scannability. Accepts any icon name from the icon library or a custom string identifier.", - "isOptional": true, - "defaultValue": "''" + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", + "name": "id", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "lang", - "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry).", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "loading", - "value": "boolean", - "description": "Whether to replace the button content with a loading indicator while a background action is being performed.\n\nThis also disables the button component.", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "target", - "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "tone", - "value": "ToneKeyword", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "type", - "value": "'submit' | 'button' | 'reset'", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "isOptional": true, - "defaultValue": "'button'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "variant", - "value": "'auto' | 'primary' | 'secondary' | 'tertiary'", - "description": "The visual appearance of the button component.\n\n- `auto`: The variant is automatically determined by the button component's context.\n- `primary`: High emphasis button for the primary action on the page. Should be used sparingly.\n- `secondary`: Medium emphasis button for secondary actions.\n- `tertiary`: Low emphasis button for less important actions.", - "isOptional": true, - "defaultValue": "'auto'" - } - ] - } - }, - "PreactInputProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "PreactInputProps", - "value": "Required<\n Pick\n>", - "description": "Represents the essential input props required for Preact-based input elements. Includes properties like `disabled`, `id`, `name`, and `value`.", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "disabled", + "name": "required", "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", - "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "name", + "name": "value", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "value", + "name": "view", "value": "string", - "description": "", + "description": "Displayed month in `YYYY-MM` format.\n\n`onViewChange` is called when this value changes.\n\nDefaults to `defaultView`.", "isOptional": true } - ] + ], + "value": "export interface DateFieldProps\n extends PreactFieldProps,\n Required<\n Pick<\n DateFieldProps$1,\n | 'allow'\n | 'allowDays'\n | 'disallow'\n | 'disallowDays'\n | 'value'\n | 'defaultValue'\n | 'view'\n | 'defaultView'\n >\n > {}" } }, - "ClickableBaseProps": { + "DateFieldJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ClickableBaseProps", - "value": "Required<\n Pick<\n ClickableProps$1,\n | 'command'\n | 'commandFor'\n | 'interestFor'\n | 'disabled'\n | 'download'\n | 'href'\n | 'lang'\n | 'loading'\n | 'overflow'\n | 'target'\n | 'type'\n >\n>", - "description": "Represents the base clickable props with all properties marked as required.", + "name": "DateFieldJSXProps", + "description": "The JSX props for the date field component. These properties extend `DateFieldProps` with JSX-specific event callbacks for React-style event handling when used in Preact, including specialized callbacks for view changes and invalid date attempts.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", + "name": "allow", + "value": "string", + "description": "Dates that can be selected.\n\nA comma-separated list of dates, date ranges. Whitespace is allowed after commas.\n\nThe default `''` allows all dates.\n\n- Dates in `YYYY-MM-DD` format allow a single date.\n- Dates in `YYYY-MM` format allow a whole month.\n- Dates in `YYYY` format allow a whole year.\n- Ranges are expressed as `start--end`. - Ranges are inclusive.\n - If either `start` or `end` is omitted, the range is unbounded in that direction.\n - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.\n So `2024--` is equivalent to `2024-01-01--`.\n - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.\n So `--2024` is equivalent to `--2024-12-31`.\n - Whitespace is allowed either side of `--`.", "isOptional": true, - "defaultValue": "'--auto'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", + "name": "allowDays", "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", - "isOptional": true - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "disabled", - "value": "boolean", - "description": "Whether the component is disabled, preventing clicks and focus. When disabled, the `click` event won't fire and click events from child elements stop propagating immediately. Interactive child elements can still receive focus and be interacted with. This doesn't apply visual styling by default. You shouldapply disabled styling as needed.", + "description": "Days of the week that can be selected. These intersect with the result of `allow` and `disallow`.\n\nA comma-separated list of days. Whitespace is allowed after commas.\n\nThe default `''` has no effect on the result of `allow` and `disallow`.\n\nDays are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "download", - "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", - "isOptional": true + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "href", + "name": "defaultValue", "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", + "name": "defaultView", "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", + "description": "Default month to display in `YYYY-MM` format.\n\nThis value is used until `view` is set, either directly or as a result of user interaction.\n\nDefaults to the current month in the user's locale.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "lang", - "value": "string", - "description": "The language of the text content.\n\nUse this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation.\n\nThe value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry).", - "isOptional": true, - "defaultValue": "''" + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "loading", + "name": "disabled", "value": "boolean", - "description": "Whether the component is in a loading state, which indicates to assistive technology that an action is in progress and prevents interaction.", + "description": "Disables the field, disallowing any interaction.", "isOptional": true, "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "overflow", - "value": "'hidden' | 'visible'", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "name": "disallow", + "value": "string", + "description": "Dates that cannot be selected. These subtract from `allow`.\n\nA comma-separated list of dates, date ranges. Whitespace is allowed after commas.\n\nThe default `''` has no effect on `allow`.\n\n- Dates in `YYYY-MM-DD` format disallow a single date.\n- Dates in `YYYY-MM` format disallow a whole month.\n- Dates in `YYYY` format disallow a whole year.\n- Ranges are expressed as `start--end`. - Ranges are inclusive.\n - If either `start` or `end` is omitted, the range is unbounded in that direction.\n - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.\n So `2024--` is equivalent to `2024-01-01--`.\n - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.\n So `--2024` is equivalent to `--2024-12-31`.\n - Whitespace is allowed either side of `--`.", "isOptional": true, - "defaultValue": "'visible'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "target", - "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "name": "disallowDays", + "value": "string", + "description": "Days of the week that cannot be selected. This subtracts from `allowDays`, and intersects with the result of `allow` and `disallow`.\n\nA comma-separated list of days. Whitespace is allowed after commas.\n\nThe default `''` has no effect on `allowDays`.\n\nDays are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "type", - "value": "'submit' | 'button' | 'reset'", - "description": "The behavior of the button component.\n\n- `button`: Used to indicate the component acts as a button, meaning it has no default action.\n- `reset`: Used to indicate the component acts as a reset button, meaning it resets the closest form (returning fields to their default values).\n- `submit`: Used to indicate the component acts as a submit button, meaning it submits the closest form.\n\nThis property is ignored if the component supports `href` or `commandFor`/`command` and one of them is set.", - "isOptional": true, - "defaultValue": "'button'" - } - ] - } - }, - "PreactFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "PreactFieldProps", - "value": "PreactInputProps & Required<\n Pick<\n TextFieldProps$1,\n | 'defaultValue'\n | 'details'\n | 'error'\n | 'label'\n | 'labelAccessibilityVisibility'\n | 'placeholder'\n | 'readOnly'\n | 'required'\n >\n > & {\n /**\n * Controls browser autofill behavior for the field.\n *\n * Basic values:\n * - `on` - Enables autofill without specifying content type (default)\n * - `off` - Disables autofill for sensitive data or one-time codes\n *\n * Specific field values describe the expected data type. You can optionally prefix these with:\n * - `section-${string}` - Scopes autofill to a specific form section (when multiple forms exist on the same page)\n * - `shipping` or `billing` - Indicates whether the data is for shipping or billing purposes\n * - Both section and group (for example, `section-primary shipping email`)\n *\n * Providing a specific autofill token helps browsers suggest more relevant saved data.\n *\n * Learn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.\n *\n * @default 'tel' for PhoneField\n * @default 'email' for EmailField\n * @default 'url' for URLField\n * @default 'on' for everything else\n */\n autocomplete: Autocomplete;\n }", - "description": "Represents the props for Preact-based form field components with autocomplete support. The generic type parameter allows specifying the valid autocomplete values for the field.", - "isPublicDocs": true - } - }, - "TextFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "TextFieldProps", - "value": "PreactFieldProps<\n /** @default 'on' */\n Required['autocomplete']\n> & Required<\n Pick<\n TextFieldProps$1,\n 'icon' | 'maxLength' | 'minLength' | 'prefix' | 'suffix'\n >\n >", - "description": "Represents the props for text input field components. Extends `PreactFieldProps` with autocomplete support for text-related fields.", - "isPublicDocs": true - } - }, - "ColorFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ColorFieldProps", - "value": "Omit<\n PreactFieldProps['autocomplete']>,\n 'value' | 'defaultValue'\n> & Required>", - "description": "Represents the props for color input field components. Extends `PreactFieldProps` with autocomplete support for color-related fields.", - "isPublicDocs": true - } - }, - "ReplaceType": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ReplaceType", - "value": "Exclude | TTo", - "description": "A utility type that replaces occurrences of one type with another within a union type. Useful for type transformations where you need to swap out specific types.", - "isPublicDocs": true - } - }, - "EmailFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "EmailFieldProps", - "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required>", - "description": "Represents the props for email input field components. Extends `PreactFieldProps` with autocomplete support for email-related fields.", - "isPublicDocs": true - } - }, - "RequiredAlignedProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RequiredAlignedProps", - "value": "Required", - "description": "Represents the grid component props with all properties marked as required.", - "isPublicDocs": true, - "members": [ + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityLabel", + "name": "id", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityRole", - "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", - "isOptional": true, - "defaultValue": "'generic'" + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityVisibility", - "value": "'visible' | 'hidden' | 'exclusive'", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "alignContent", - "value": "MaybeResponsive", - "description": "The vertical alignment of the entire grid within its container (in horizontal layouts).\n\nUse this to distribute grid rows along the block axis (vertical in left-to-right/right-to-left layouts, horizontal in vertical writing modes). This property overrides the block value set by `placeContent`.\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "alignItems", - "value": "MaybeResponsive", - "description": "The vertical alignment of grid items within their grid areas (in horizontal layouts).\n\nUse this to position items along the block axis (vertical in left-to-right/right-to-left layouts, horizontal in vertical writing modes). This property overrides the block value set by `placeItems`.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the field loses focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "background", - "value": "BackgroundColorKeyword", - "description": "The background color of the element. Use `transparent` for no background, `subdued` for a subtle background, `base` for standard background, or `strong` for a prominent background.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isOptional": true, - "defaultValue": "'transparent'" + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the field's value changes and the field loses focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blockSize", - "value": "MaybeResponsive", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about the [block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the field receives focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "border", - "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.\n\nAccepts a size value, optionally followed by a color, optionally followed by a style. Omitted values use defaults: color defaults to `base`, style defaults to `auto`.\n\nIndividual properties (`borderWidth`, `borderStyle`, `borderColor`) can override values set here.", - "isOptional": true, - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the field's value changes as the user types or selects.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderColor", - "value": "ColorKeyword | ''", - "description": "The color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "onInvalid", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the user attempts to enter an invalid date.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- One value: applies to all corners\n- Two values: applies to start corners (top-left & bottom-right) and end corners (top-right & bottom-left) respectively\n- Three values: applies to start-start (top-left), end corners (top-right & bottom-left), and end-end (bottom-right) respectively\n- Four values: applies to start-start (top-left), start-end (top-right), end-end (bottom-right), and end-start (bottom-left) respectively\n\nExamples:\n- `small-100`: All corners have `small-100` radius\n- `small-100 none`: Top-left and bottom-right are `small-100`, top-right and bottom-left are `none`\n- `small-100 none large-100`: Top-left is `small-100`, top-right and bottom-left are `none`, bottom-right is `large-100`\n- `small-100 none large-100 base`: Each corner has its specified radius value", - "isOptional": true, - "defaultValue": "'none'" + "name": "onViewChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the visible month or year in the calendar changes.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderStyle", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted.\n\nWhen set, this overrides the style value specified in the `border` property.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different styles per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", - "isOptional": true, - "defaultValue": "'' - meaning no override" - }, + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderWidth", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The content displayed within the box component, which serves as a flexible container for organizing and styling other components.", - "isOptional": true + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "columnGap", - "value": "MaybeResponsive", - "description": "The horizontal spacing between elements (in horizontal writing modes).\n\nSets the gap along the inline axis. This overrides the column value specified in `gap`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "display", - "value": "MaybeResponsive<'auto' | 'none'>", - "description": "The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n\nLearn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).", - "isOptional": true, - "defaultValue": "'auto'" - }, + "name": "view", + "value": "string", + "description": "Displayed month in `YYYY-MM` format.\n\n`onViewChange` is called when this value changes.\n\nDefaults to `defaultView`.", + "isOptional": true + } + ], + "value": "export interface DateFieldJSXProps\n extends Partial>,\n Pick,\n FieldSlotInternalReactProps {\n /**\n * A callback that's triggered when the field loses focus.\n */\n onBlur?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the field's value changes and the field loses focus.\n */\n onChange?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the field receives focus.\n */\n onFocus?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the field's value changes as the user types or selects.\n */\n onInput?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the user attempts to enter an invalid date.\n */\n onInvalid?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the visible month or year in the calendar changes.\n */\n onViewChange?: ((event: CallbackEvent) => void) | null;\n}" + } + }, + "DatePickerProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "DatePickerProps", + "description": "The properties for the date picker component. These properties configure a standalone calendar interface for selecting single dates or date ranges, with support for date constraints, day-of-week restrictions, and month/year navigation.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gap", - "value": "MaybeResponsive>", - "description": "The spacing between child elements.\n\nAccepts a single value to apply to both axes, or two space-separated values to set the row and column gaps independently. For example: `large-100 large-500` sets the row gap to `large-100` and column gap to `large-500`.", + "name": "allow", + "value": "string", + "description": "Dates that can be selected.\n\nA comma-separated list of dates, date ranges. Whitespace is allowed after commas.\n\nThe default `''` allows all dates.\n\n- Dates in `YYYY-MM-DD` format allow a single date.\n- Dates in `YYYY-MM` format allow a whole month.\n- Dates in `YYYY` format allow a whole year.\n- Ranges are expressed as `start--end`. - Ranges are inclusive.\n - If either `start` or `end` is omitted, the range is unbounded in that direction.\n - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.\n So `2024--` is equivalent to `2024-01-01--`.\n - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.\n So `--2024` is equivalent to `--2024-12-31`.\n - Whitespace is allowed either side of `--`.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gridTemplateColumns", - "value": "MaybeResponsive", - "description": "The columns in the grid and their sizes.\n\nUse values like `1fr 2fr` to create fluid columns, `200px 1fr` to mix fixed and flexible columns, or `repeat(3, 1fr)` to create equal-width columns.\n\nLearn more about the [grid-template-columns property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-columns).", + "name": "allowDays", + "value": "string", + "description": "Days of the week that can be selected. These intersect with the result of `allow` and `disallow`.\n\nA comma-separated list of days. Whitespace is allowed after commas.\n\nThe default `''` has no effect on the result of `allow` and `disallow`.\n\nDays are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gridTemplateRows", - "value": "MaybeResponsive", - "description": "The rows in the grid and their sizes.\n\nUse values like `100px auto` to create rows with fixed and automatic heights, or `repeat(3, 100px)` to create equal-height rows.\n\nLearn more about the [grid-template-rows property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-rows).", + "name": "defaultValue", + "value": "string", + "description": "Default selected value.\n\nThe default means no date is selected.\n\nIf the provided value is invalid, no date is selected.\n\n- If `type=\"single\"`, this is a date in `YYYY-MM-DD` format.\n- If `type=\"multiple\"`, this is a comma-separated list of dates in `YYYY-MM-DD` format.\n- If `type=\"range\"`, this is a range in `YYYY-MM-DD--YYYY-MM-DD` format. The range is inclusive.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "\"\"" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", + "name": "defaultView", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "Default month to display in `YYYY-MM` format.\n\nThis value is used until `view` is set, either directly or as a result of user interaction.\n\nDefaults to the current month in the user's locale.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "inlineSize", - "value": "MaybeResponsive", - "description": "The horizontal size of the element in standard layouts (width in left-to-right or right-to-left writing modes).\n\nInline size adjusts based on the writing direction: in horizontal layouts, it controls the width; in vertical layouts, it controls the height. This ensures consistent behavior across different text directions.\n\nLearn more about the [inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", + "name": "disallow", + "value": "string", + "description": "Dates that cannot be selected. These subtract from `allow`.\n\nA comma-separated list of dates, date ranges. Whitespace is allowed after commas.\n\nThe default `''` has no effect on `allow`.\n\n- Dates in `YYYY-MM-DD` format disallow a single date.\n- Dates in `YYYY-MM` format disallow a whole month.\n- Dates in `YYYY` format disallow a whole year.\n- Ranges are expressed as `start--end`. - Ranges are inclusive.\n - If either `start` or `end` is omitted, the range is unbounded in that direction.\n - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.\n So `2024--` is equivalent to `2024-01-01--`.\n - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.\n So `--2024` is equivalent to `--2024-12-31`.\n - Whitespace is allowed either side of `--`.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "justifyContent", - "value": "MaybeResponsive", - "description": "The horizontal alignment of the entire grid within its container (in horizontal layouts).\n\nUse this to distribute grid columns along the inline axis (horizontal in left-to-right/right-to-left layouts, vertical in vertical writing modes). This property overrides the inline value set by `placeContent`.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", + "name": "disallowDays", + "value": "string", + "description": "Days of the week that cannot be selected. This subtracts from `allowDays`, and intersects with the result of `allow` and `disallow`.\n\nA comma-separated list of days. Whitespace is allowed after commas.\n\nThe default `''` has no effect on `allowDays`.\n\nDays are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "justifyItems", - "value": "MaybeResponsive", - "description": "The horizontal alignment of grid items within their grid areas (in horizontal layouts).\n\nUse this to position items along the inline axis (horizontal in left-to-right/right-to-left layouts, vertical in vertical writing modes). This property overrides the inline value set by `placeItems`.\n\nLearn more about the [justify-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxBlockSize", - "value": "MaybeResponsive", - "description": "The maximum vertical size of the element in standard layouts (max-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the block axis.\n\nLearn more about the [max-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", - "isOptional": true, - "defaultValue": "'none'" + "name": "type", + "value": "'single' | 'range'", + "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "defaultValue": "\"single\"" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxInlineSize", - "value": "MaybeResponsive", - "description": "The maximum horizontal size of the element in standard layouts (max-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the inline axis.\n\nLearn more about the [max-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "name": "value", + "value": "string", + "description": "Current selected value.\n\nThe default means no date is selected.\n\nIf the provided value is invalid, no date is selected.\n\nOtherwise:\n\n- If `type=\"single\"`, this is a date in `YYYY-MM-DD` format.\n- If `type=\"multiple\"`, this is a comma-separated list of dates in `YYYY-MM-DD` format.\n- If `type=\"range\"`, this is a range in `YYYY-MM-DD--YYYY-MM-DD` format. The range is inclusive.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "\"\"" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minBlockSize", - "value": "MaybeResponsive", - "description": "The minimum vertical size of the element in standard layouts (min-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the block axis.\n\nLearn more about the [min-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "name": "view", + "value": "string", + "description": "Displayed month in `YYYY-MM` format.\n\n`onViewChange` is called when this value changes.\n\nDefaults to `defaultView`.", + "isOptional": true + } + ], + "value": "export interface DatePickerProps\n extends Required<\n Pick<\n DatePickerProps$1,\n | 'defaultView'\n | 'view'\n | 'allow'\n | 'disallow'\n | 'allowDays'\n | 'disallowDays'\n | 'value'\n | 'defaultValue'\n | 'name'\n >\n > {\n /**\n * The type of date selection allowed.\n *\n * - `single`: Select a single date\n * - `range`: Select a date range\n *\n * @default \"single\"\n */\n type: Extract;\n}" + } + }, + "DatePickerJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "DatePickerJSXProps", + "description": "The JSX props for the date picker component. These properties extend `DatePickerProps` with JSX-specific event callbacks for React-style event handling when used in Preact, including callbacks for date selection, focus events, and view changes.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "allow", + "value": "string", + "description": "Dates that can be selected.\n\nA comma-separated list of dates, date ranges. Whitespace is allowed after commas.\n\nThe default `''` allows all dates.\n\n- Dates in `YYYY-MM-DD` format allow a single date.\n- Dates in `YYYY-MM` format allow a whole month.\n- Dates in `YYYY` format allow a whole year.\n- Ranges are expressed as `start--end`. - Ranges are inclusive.\n - If either `start` or `end` is omitted, the range is unbounded in that direction.\n - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.\n So `2024--` is equivalent to `2024-01-01--`.\n - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.\n So `--2024` is equivalent to `--2024-12-31`.\n - Whitespace is allowed either side of `--`.", "isOptional": true, - "defaultValue": "'0'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`2024-02--2025` // allow any date from February 2024 to the end of 2025\n`2024-02--` // allow any date from February 2024 to the end of the month\n`2024-05-09, 2024-05-11` // allow only the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minInlineSize", - "value": "MaybeResponsive", - "description": "The minimum horizontal size of the element in standard layouts (min-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the inline axis.\n\nLearn more about the [min-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", + "name": "allowDays", + "value": "string", + "description": "Days of the week that can be selected. These intersect with the result of `allow` and `disallow`.\n\nA comma-separated list of days. Whitespace is allowed after commas.\n\nThe default `''` has no effect on the result of `allow` and `disallow`.\n\nDays are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.", "isOptional": true, - "defaultValue": "'0'" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // allow only weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "overflow", - "value": "'hidden' | 'visible'", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "name": "defaultValue", + "value": "string", + "description": "Default selected value.\n\nThe default means no date is selected.\n\nIf the provided value is invalid, no date is selected.\n\n- If `type=\"single\"`, this is a date in `YYYY-MM-DD` format.\n- If `type=\"multiple\"`, this is a comma-separated list of dates in `YYYY-MM-DD` format.\n- If `type=\"range\"`, this is a range in `YYYY-MM-DD--YYYY-MM-DD` format. The range is inclusive.", "isOptional": true, - "defaultValue": "'visible'" + "defaultValue": "\"\"" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "padding", - "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding.", - "isOptional": true, - "defaultValue": "'none'" + "name": "defaultView", + "value": "string", + "description": "Default month to display in `YYYY-MM` format.\n\nThis value is used until `view` is set, either directly or as a result of user interaction.\n\nDefaults to the current month in the user's locale.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlock", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`.", + "name": "disallow", + "value": "string", + "description": "Dates that cannot be selected. These subtract from `allow`.\n\nA comma-separated list of dates, date ranges. Whitespace is allowed after commas.\n\nThe default `''` has no effect on `allow`.\n\n- Dates in `YYYY-MM-DD` format disallow a single date.\n- Dates in `YYYY-MM` format disallow a whole month.\n- Dates in `YYYY` format disallow a whole year.\n- Ranges are expressed as `start--end`. - Ranges are inclusive.\n - If either `start` or `end` is omitted, the range is unbounded in that direction.\n - If parts of the date are omitted for `start`, they are assumed to be the minimum possible value.\n So `2024--` is equivalent to `2024-01-01--`.\n - If parts of the date are omitted for `end`, they are assumed to be the maximum possible value.\n So `--2024` is equivalent to `--2024-12-31`.\n - Whitespace is allowed either side of `--`.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "`--2024-02` // disallow any date before February 2024\n`2024-05-09, 2024-05-11` // disallow the 9th and 11th of May 2024", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockEnd", - "value": "MaybeResponsive", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`.", + "name": "disallowDays", + "value": "string", + "description": "Days of the week that cannot be selected. This subtracts from `allowDays`, and intersects with the result of `allow` and `disallow`.\n\nA comma-separated list of days. Whitespace is allowed after commas.\n\nThe default `''` has no effect on `allowDays`.\n\nDays are `sunday`, `monday`, `tuesday`, `wednesday`, `thursday`, `friday`, `saturday`.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "\"\"", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "'saturday, sunday' // disallow weekends within the result of `allow` and `disallow`.", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockStart", - "value": "MaybeResponsive", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInline", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineEnd", - "value": "MaybeResponsive", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the picker loses focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineStart", - "value": "MaybeResponsive", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the selected date changes and the picker loses focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "placeContent", - "value": "MaybeResponsive<\n `${AlignContentKeyword} ${JustifyContentKeyword}` | AlignContentKeyword\n >", - "description": "A shorthand property for `justify-content` and `align-content`.\n\nLearn more about the [place-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/place-content).", - "isOptional": true, - "defaultValue": "'normal normal'" + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the picker receives focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "placeItems", - "value": "MaybeResponsive<\n `${AlignItemsKeyword} ${JustifyItemsKeyword}` | AlignItemsKeyword\n >", - "description": "A shorthand for setting both `justify-items` and `align-items` in a single declaration.\n\nAccepts either a single value (applied to both axes) or two space-separated values (align-items justify-items).\n\nLearn more about the [place-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/place-items).", - "isOptional": true, - "defaultValue": "'normal normal'" + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the selected date changes as the user interacts with the picker.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "rowGap", - "value": "MaybeResponsive", - "description": "The vertical spacing between elements (in horizontal writing modes).\n\nSets the gap along the block axis. This overrides the row value specified in `gap`.", + "name": "onViewChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the visible month or year in the calendar changes.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "type", + "value": "'single' | 'range'", + "description": "The type of date selection allowed.\n\n- `single`: Select a single date\n- `range`: Select a date range", + "defaultValue": "\"single\"" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "Current selected value.\n\nThe default means no date is selected.\n\nIf the provided value is invalid, no date is selected.\n\nOtherwise:\n\n- If `type=\"single\"`, this is a date in `YYYY-MM-DD` format.\n- If `type=\"multiple\"`, this is a comma-separated list of dates in `YYYY-MM-DD` format.\n- If `type=\"range\"`, this is a range in `YYYY-MM-DD--YYYY-MM-DD` format. The range is inclusive.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "\"\"" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "view", + "value": "string", + "description": "Displayed month in `YYYY-MM` format.\n\n`onViewChange` is called when this value changes.\n\nDefaults to `defaultView`.", + "isOptional": true } - ] + ], + "value": "export interface DatePickerJSXProps\n extends Partial,\n Pick {\n /**\n * A callback that's triggered when the visible month or year in the calendar changes.\n */\n onViewChange?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the picker receives focus.\n */\n onFocus?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the picker loses focus.\n */\n onBlur?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the selected date changes as the user interacts with the picker.\n */\n onInput?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the selected date changes and the picker loses focus.\n */\n onChange?: ((event: CallbackEvent) => void) | null;\n}" } }, - "ResponsiveGridProps": { + "DividerProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ResponsiveGridProps", - "value": "MakeResponsivePick<\n RequiredAlignedProps,\n 'rowGap' | 'columnGap' | 'gap' | 'gridTemplateColumns' | 'gridTemplateRows'\n>", - "description": "Represents grid props with responsive capabilities for layout properties.\n\nThis enables conditional styling based on container queries.", + "name": "DividerProps", + "description": "The properties for the divider component. A divider creates a visual separator to distinguish different sections of content.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "columnGap", - "value": "MaybeResponsive", - "description": "The horizontal spacing between elements (in horizontal writing modes).\n\nSets the gap along the inline axis. This overrides the column value specified in `gap`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "color", + "value": "'base' | 'strong'", + "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gap", - "value": "MaybeResponsive>", - "description": "The spacing between child elements.\n\nAccepts a single value to apply to both axes, or two space-separated values to set the row and column gaps independently. For example: `large-100 large-500` sets the row gap to `large-100` and column gap to `large-500`.", - "isOptional": true, - "defaultValue": "'none'" - }, + "name": "direction", + "value": "'inline' | 'block'", + "description": "The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n\n- `inline`: Horizontal divider for separating vertically stacked content\n- `block`: Vertical divider for separating horizontally arranged content", + "defaultValue": "'inline'" + } + ], + "value": "export interface DividerProps\n extends Pick {\n /**\n * The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n *\n * - `inline`: Horizontal divider for separating vertically stacked content\n * - `block`: Vertical divider for separating horizontally arranged content\n *\n * @default 'inline'\n */\n direction: Extract;\n /**\n * The visual prominence of the divider line.\n *\n * - `base`: Standard divider for most separations (default)\n * - `strong`: More prominent divider for major section breaks\n *\n * @default 'base'\n */\n color: Extract;\n}" + } + }, + "DividerJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "DividerJSXProps", + "description": "The properties for the divider component when it's used in JSX.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gridTemplateColumns", - "value": "MaybeResponsive", - "description": "The columns in the grid and their sizes.\n\nUse values like `1fr 2fr` to create fluid columns, `200px 1fr` to mix fixed and flexible columns, or `repeat(3, 1fr)` to create equal-width columns.\n\nLearn more about the [grid-template-columns property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-columns).", - "isOptional": true, - "defaultValue": "'none'" + "name": "color", + "value": "'base' | 'strong'", + "description": "The visual prominence of the divider line.\n\n- `base`: Standard divider for most separations (default)\n- `strong`: More prominent divider for major section breaks", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gridTemplateRows", - "value": "MaybeResponsive", - "description": "The rows in the grid and their sizes.\n\nUse values like `100px auto` to create rows with fixed and automatic heights, or `repeat(3, 100px)` to create equal-height rows.\n\nLearn more about the [grid-template-rows property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-rows).", - "isOptional": true, - "defaultValue": "'none'" + "name": "direction", + "value": "'inline' | 'block'", + "description": "The orientation of the divider line, using [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).\n\n- `inline`: Horizontal divider for separating vertically stacked content\n- `block`: Vertical divider for separating horizontally arranged content", + "defaultValue": "'inline'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "rowGap", - "value": "MaybeResponsive", - "description": "The vertical spacing between elements (in horizontal writing modes).\n\nSets the gap along the block axis. This overrides the row value specified in `gap`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true } - ] + ], + "value": "export interface DividerJSXProps\n extends Partial,\n Pick {}" } }, - "RequiredGridItemProps": { + "DropZoneProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RequiredGridItemProps", - "value": "Required", - "description": "Represents the grid item component props with all properties marked as required.", + "name": "DropZoneProps", + "description": "*", "isPublicDocs": true, "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accept", + "value": "string", + "description": "A string representing the types of files that are accepted by the drop zone. This string is a comma-separated list of unique file type specifiers which can be one of the following:\n- A file extension starting with a period (\".\") character (e.g. .jpg, .pdf, .doc)\n- A valid MIME type string with no extensions\n\nIf omitted, all file types are accepted.", + "isOptional": true, + "defaultValue": "''" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the item. When set, it will be announced to buyers using assistive technologies and will provide them with more context.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityRole", - "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", "isOptional": true, - "defaultValue": "'generic'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityVisibility", - "value": "'visible' | 'hidden' | 'exclusive'", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", - "isOptional": true, - "defaultValue": "'visible'" + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "background", - "value": "BackgroundColorKeyword", - "description": "The background color of the element. Use `transparent` for no background, `subdued` for a subtle background, `base` for standard background, or `strong` for a prominent background.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", + "name": "files", + "value": "ReadonlyArray", + "description": "An array of File objects representing the files currently selected by the user.\n\nThis property is read-only and cannot be directly modified. To clear the selected files, set the `value` prop to an empty string or null.", "isOptional": true, - "defaultValue": "'transparent'" + "defaultValue": "[]" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blockSize", - "value": "MaybeResponsive", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about the [block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "border", - "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.\n\nAccepts a size value, optionally followed by a color, optionally followed by a style. Omitted values use defaults: color defaults to `base`, style defaults to `auto`.\n\nIndividual properties (`borderWidth`, `borderStyle`, `borderColor`) can override values set here.", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderColor", - "value": "ColorKeyword | ''", - "description": "The color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "name": "multiple", + "value": "boolean", + "description": "Whether multiple files can be selected or dropped at once.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- One value: applies to all corners\n- Two values: applies to start corners (top-left & bottom-right) and end corners (top-right & bottom-left) respectively\n- Three values: applies to start-start (top-left), end corners (top-right & bottom-left), and end-end (bottom-right) respectively\n- Four values: applies to start-start (top-left), start-end (top-right), end-end (bottom-right), and end-start (bottom-left) respectively\n\nExamples:\n- `small-100`: All corners have `small-100` radius\n- `small-100 none`: Top-left and bottom-right are `small-100`, top-right and bottom-left are `none`\n- `small-100 none large-100`: Top-left is `small-100`, top-right and bottom-left are `none`, bottom-right is `large-100`\n- `small-100 none large-100 base`: Each corner has its specified radius value", - "isOptional": true, - "defaultValue": "'none'" + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderStyle", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted.\n\nWhen set, this overrides the style value specified in the `border` property.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different styles per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderWidth", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", + "name": "value", + "value": "string", + "description": "A string that represents the path to the selected file(s). If no file is selected yet, the value is an empty string (\"\"). When the user selected multiple files, the value represents the first file in the list of files they selected. The value is always the file's name prefixed with \"C:\\fakepath\\\", which isn't the real path of the file.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "''" + } + ], + "value": "export interface DropZoneProps\n extends Required<\n Pick<\n DropZoneProps$1,\n | 'accept'\n | 'accessibilityLabel'\n | 'disabled'\n | 'files'\n | 'name'\n | 'error'\n | 'label'\n | 'labelAccessibilityVisibility'\n | 'multiple'\n | 'required'\n | 'value'\n >\n > {}" + } + }, + "EmailFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "EmailFieldProps", + "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required>", + "description": "The properties for the email field component. These properties configure a specialized text input field for entering email addresses with built-in validation and appropriate keyboard support.", + "isPublicDocs": true + } + }, + "EmailFieldJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "EmailFieldJSXProps", + "description": "The JSX props for the email field component. These properties extend `EmailFieldProps` with JSX-specific event callbacks for React-style event handling.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The content displayed within the box component, which serves as a flexible container for organizing and styling other components.", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "display", - "value": "MaybeResponsive<'auto' | 'none'>", - "description": "The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n\nLearn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).", - "isOptional": true, - "defaultValue": "'auto'" + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gridColumn", - "value": "`span ${number}` | 'auto'", - "description": "The number of columns the item will span across.\n\nLearn more about the [grid-column property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gridRow", - "value": "`span ${number}` | 'auto'", - "description": "The number of rows the item will span across.\n\nLearn more about the [grid-row property](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).", - "isOptional": true, - "defaultValue": "'auto'" + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "inlineSize", - "value": "MaybeResponsive", - "description": "The horizontal size of the element in standard layouts (width in left-to-right or right-to-left writing modes).\n\nInline size adjusts based on the writing direction: in horizontal layouts, it controls the width; in vertical layouts, it controls the height. This ensures consistent behavior across different text directions.\n\nLearn more about the [inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxBlockSize", - "value": "MaybeResponsive", - "description": "The maximum vertical size of the element in standard layouts (max-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the block axis.\n\nLearn more about the [max-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxInlineSize", - "value": "MaybeResponsive", - "description": "The maximum horizontal size of the element in standard layouts (max-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the inline axis.\n\nLearn more about the [max-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", + "name": "maxLength", + "value": "number", + "description": "Specifies the maximum number of characters allowed.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "Infinity" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minBlockSize", - "value": "MaybeResponsive", - "description": "The minimum vertical size of the element in standard layouts (min-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the block axis.\n\nLearn more about the [min-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", + "name": "minLength", + "value": "number", + "description": "Specifies the min number of characters allowed.", "isOptional": true, - "defaultValue": "'0'" + "defaultValue": "0" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minInlineSize", - "value": "MaybeResponsive", - "description": "The minimum horizontal size of the element in standard layouts (min-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the inline axis.\n\nLearn more about the [min-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", - "isOptional": true, - "defaultValue": "'0'" + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "overflow", - "value": "'hidden' | 'visible'", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", - "isOptional": true, - "defaultValue": "'visible'" + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "padding", - "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding.", - "isOptional": true, - "defaultValue": "'none'" - }, + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user has finished editing the field, such as when they blur the field.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlock", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockEnd", - "value": "MaybeResponsive", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user makes changes to the field value. This fires before `onChange`.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockStart", - "value": "MaybeResponsive", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInline", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`.", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineEnd", - "value": "MaybeResponsive", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`.", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineStart", - "value": "MaybeResponsive", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", + "isOptional": true } - ] + ], + "value": "export interface EmailFieldJSXProps\n extends Partial>,\n Pick,\n FieldReactProps,\n FieldSlotInternalReactProps {}" } }, - "RequiredLinkProps": { + "RequiredAlignedProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "TypeAliasDeclaration", - "name": "RequiredLinkProps", - "value": "Required", - "description": "Represents the link component props with all properties marked as required.", + "name": "RequiredAlignedProps", + "value": "Required", + "description": "A version of the grid properties with all fields required.", "isPublicDocs": true, "members": [ { @@ -18170,1090 +19588,5889 @@ "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The text or elements displayed within the link component, which navigates users to a different location when activated.", - "isOptional": true + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "'--auto'" + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", - "isOptional": true + "name": "alignContent", + "value": "MaybeResponsive", + "description": "Aligns the grid along the block (column) axis.\n\nThis overrides the block value of `placeContent`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "download", - "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", - "isOptional": true + "name": "alignItems", + "value": "MaybeResponsive", + "description": "Aligns the grid items along the block (column) axis.\n\nThis overrides the block value of `placeItems`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "href", - "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", - "isOptional": true + "name": "background", + "value": "BackgroundColorKeyword", + "description": "Adjust the background of the element.", + "isOptional": true, + "defaultValue": "'transparent'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", - "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", - "isOptional": true + "name": "blockSize", + "value": "MaybeResponsive", + "description": "Adjust the block size.", + "isOptional": true, + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", - "isOptional": true + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "lang", - "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry).", - "isOptional": true + "name": "borderColor", + "value": "ColorKeyword | ''", + "description": "Set the color of the border.\n\nIf set, it takes precedence over the `border` property's color.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onBlur", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", - "isOptional": true + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Set the radius of the border.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `start-start start-end end-end end-start`\n- 3 values: `start-start (start-end & end-start) start-end`\n- 2 values: `(start-start & end-end) (start-end & end-start)`\n\nFor example:\n- `small-100` means start-start, start-end, end-end and end-start border radii are `small-100`.\n- `small-100 none` means start-start and end-end border radii are `small-100`, start-end and end-start border radii are `none`.\n- `small-100 none large-100` means start-start border radius is `small-100`, start-end border radius is `none`, end-end border radius is `large-100` and end-start border radius is `none`.\n- `small-100 none large-100 small-100` means start-start border radius is `small-100`, start-end border radius is `none`, end-end border radius is `large-100` and end-start border radius is `small-100`.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onClick", - "value": "(event: Event) => void", - "description": "A callback fired when the link is activated, before navigating to the location specified by `href`. Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).", - "isOptional": true + "name": "borderStyle", + "value": "MaybeAllValuesShorthandProperty | ''", + "description": "Set the style of the border.\n\nIf set, it takes precedence over the `border` property's style.\n\nLike CSS, up to 4 values can be specified.\n\nIf one value is specified, it applies to all sides.\n\nIf two values are specified, they apply to the block sides and inline sides respectively.\n\nIf three values are specified, they apply to the block-start, both inline sides, and block-end respectively.\n\nIf four values are specified, they apply to the block-start, block-end, inline-start, and inline-end sides respectively.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onFocus", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", + "name": "borderWidth", + "value": "MaybeAllValuesShorthandProperty | ''", + "description": "Set the width of the border.\n\nIf set, it takes precedence over the `border` property's width.\n\nLike CSS, up to 4 values can be specified.\n\nIf one value is specified, it applies to all sides.\n\nIf two values are specified, they apply to the block sides and inline sides respectively.\n\nIf three values are specified, they apply to the block-start, both inline sides, and block-end respectively.\n\nIf four values are specified, they apply to the block-start, block-end, inline-start, and inline-end sides respectively.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Box.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "target", - "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "name": "columnGap", + "value": "MaybeResponsive", + "description": "Adjust spacing between elements in the inline axis.\n\nThis overrides the column value of `gap`.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "tone", - "value": "ToneKeyword", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", + "name": "display", + "value": "MaybeResponsive<'auto' | 'none'>", + "description": "Sets the outer display type of the component. The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", "isOptional": true, "defaultValue": "'auto'" - } - ] - } - }, - "LinkBaseProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "LinkBaseProps", - "value": "Required<\n Pick<\n LinkProps$1,\n | 'accessibilityLabel'\n | 'command'\n | 'commandFor'\n | 'interestFor'\n | 'download'\n | 'href'\n | 'lang'\n | 'target'\n | 'tone'\n >\n>", - "description": "Represents the base link props with all core properties marked as required.", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", - "isOptional": true + "name": "gap", + "value": "MaybeResponsive>", + "description": "Adjust spacing between elements.\n\nA single value applies to both axes. A pair of values (eg `large-100 large-500`) can be used to set the inline and block axes respectively.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", - "description": "The action that `commandFor` should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.\n- `--copy`: Copies the target `ClipboardItem`.\n\nLearn more about the [command attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command).", + "name": "gridTemplateColumns", + "value": "MaybeResponsive", + "description": "Define columns and specify their size.", "isOptional": true, - "defaultValue": "'--auto'" + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The ID of the component to control when this component is activated. Pair with the `command` property to specify what action to perform on the target component. Learn more about the [commandfor attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor).", - "isOptional": true + "name": "gridTemplateRows", + "value": "MaybeResponsive", + "description": "Define rows and specify their size.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "download", + "name": "id", "value": "string", - "description": "Prompts the browser to download the linked URL rather than navigate to it. When set, the value specifies the suggested filename for the downloaded file.\n\nThe filename suggestion is only respected for same-origin URLs, `blob:`, and `data:` schemes. Cross-origin URLs can still trigger downloads, but browsers might ignore the suggested filename.\n\nLearn more about the [download attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download).", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "href", - "value": "string", - "description": "The URL to navigate to when clicked. The `click` event fires first, then navigation occurs. If `commandFor` is also set, the command executes instead of navigation.", - "isOptional": true + "name": "inlineSize", + "value": "MaybeResponsive", + "description": "Adjust the inline size.", + "isOptional": true, + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.", - "isOptional": true + "name": "justifyContent", + "value": "MaybeResponsive", + "description": "Aligns the grid along the inline (row) axis.\n\nThis overrides the inline value of `placeContent`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "lang", - "value": "string", - "description": "The language of the text content. Use this when the text is in a different language than the rest of the page, allowing assistive technologies such as screen readers to invoke the correct pronunciation. The value should be a valid language subtag from the [IANA language subtag registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry).", - "isOptional": true + "name": "justifyItems", + "value": "MaybeResponsive", + "description": "Aligns the grid items along the inline (row) axis.\n\nThis overrides the inline value of `placeItems`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "target", - "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", - "description": "The browsing context where the linked URL should be displayed.\n\n- `auto`: The target is automatically determined based on the origin of the URL.\n- `_blank`: Opens the URL in a new window or tab.\n- `_self`: Opens the URL in the same browsing context as the current one.\n- `_parent`: Opens the URL in the parent browsing context of the current one. If there is no parent, behaves as `_self`.\n- `_top`: Opens the URL in the topmost browsing context (the highest ancestor of the current one). If there is no ancestor, behaves as `_self`.", + "name": "maxBlockSize", + "value": "MaybeResponsive", + "description": "Adjust the maximum block size.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "tone", - "value": "ToneKeyword", - "description": "The semantic meaning and color treatment of the component.\n\n- `critical`: Urgent problems or destructive actions.\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent.", + "name": "maxInlineSize", + "value": "MaybeResponsive", + "description": "Adjust the maximum inline size.", "isOptional": true, - "defaultValue": "'auto'" - } - ] - } - }, - "PolyfillCommandEventInit": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "PolyfillCommandEventInit", - "value": "EventInit & {\n source: HTMLElement | null | undefined;\n command: PreactOverlayControlProps['command'];\n}", - "description": "Represents the initialization object for creating a polyfill command event. Used for overlay control commands in environments that require polyfills.", - "isPublicDocs": true - } - }, - "PreactOverlayControlProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "PreactOverlayControlProps", - "description": "", - "members": [ + "defaultValue": "'none'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "command", - "value": "'--auto' | '--show' | '--hide' | '--toggle'", - "description": "The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n\n- `--auto`: A default action for the target component.\n- `--show`: Shows the target component.\n- `--hide`: Hides the target component.\n- `--toggle`: Toggles the visibility of the target component.", - "defaultValue": "'--auto'" + "name": "minBlockSize", + "value": "MaybeResponsive", + "description": "Adjust the minimum block size.", + "isOptional": true, + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "commandFor", - "value": "string", - "description": "The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated." + "name": "minInlineSize", + "value": "MaybeResponsive", + "description": "Adjust the minimum inline size.", + "isOptional": true, + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "interestFor", - "value": "string", - "description": "The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information." - } - ], - "value": "export interface PreactOverlayControlProps\n extends Pick {\n /**\n * The action that [command](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#command) should take when this component is activated.\n *\n * - `--auto`: A default action for the target component.\n * - `--show`: Shows the target component.\n * - `--hide`: Hides the target component.\n * - `--toggle`: Toggles the visibility of the target component.\n *\n * @default '--auto'\n */\n command: Extract<\n InteractionProps['command'],\n '--show' | '--hide' | '--toggle' | '--auto'\n >;\n /**\n * The component that [commandFor](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#commandfor) should act on when this component is activated.\n */\n commandFor: Extract;\n /**\n * The ID of the component to show when users hover over or focus on this component. Use this to connect interactive components to popovers or tooltips that provide additional context or information.\n */\n interestFor: Extract;\n}" - } - }, - "PolyfillCommandEvent": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "PolyfillCommandEvent", - "value": "Event & {\n source: PolyfillCommandEventInit['source'];\n command: PolyfillCommandEventInit['command'];\n /** Have to use `_s_shadowSource` because `source` is retargeted to the shadow host by browsers */\n _s_shadowSource: PolyfillCommandEventInit['source'];\n}", - "description": "Represents a polyfill command event for overlay controls. Used in environments where native command events are not available.", - "isPublicDocs": true - } - }, - "RequiredAlignedModalProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RequiredAlignedModalProps", - "value": "Required", - "description": "Represents the modal component props with all properties marked as required.", - "isPublicDocs": true, - "members": [ + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose of the modal. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nThis overrides the `heading` prop for screen readers.", - "isOptional": true + "name": "padding", + "value": "MaybeResponsive>", + "description": "Adjust the padding of all edges.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `block-start inline-end block-end inline-start`\n- 3 values: `block-start inline block-end`\n- 2 values: `block inline`\n\nFor example:\n- `large` means block-start, inline-end, block-end and inline-start paddings are `large`.\n- `large none` means block-start and block-end paddings are `large`, inline-start and inline-end paddings are `none`.\n- `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`.\n- `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`.\n\nA padding value of `auto` will use the default padding for the closest container that has had its usual padding removed.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The content of the modal.", - "isOptional": true + "name": "paddingBlock", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the block-padding.\n\n- `large none` means block-start padding is `large`, block-end padding is `none`.\n\nThis overrides the block value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "heading", - "value": "string", - "description": "A title that describes the content of the modal.", - "isOptional": true + "name": "paddingBlockEnd", + "value": "MaybeResponsive", + "description": "Adjust the block-end padding.\n\nThis overrides the block-end value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "hideOverlay", - "value": "() => void", - "description": "A method to programmatically hide the overlay." + "name": "paddingBlockStart", + "value": "MaybeResponsive", + "description": "Adjust the block-start padding.\n\nThis overrides the block-start value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", - "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", - "isOptional": true + "name": "paddingInline", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the inline padding.\n\n- `large none` means inline-start padding is `large`, inline-end padding is `none`.\n\nThis overrides the inline value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onAfterHide", - "value": "(event: Event) => void", - "description": "A callback fired when the overlay is hidden, after any hide animations have completed.", - "isOptional": true + "name": "paddingInlineEnd", + "value": "MaybeResponsive", + "description": "Adjust the inline-end padding.\n\nThis overrides the inline-end value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onAfterShow", - "value": "(event: Event) => void", - "description": "A callback fired when the overlay is shown, after any show animations have completed.", - "isOptional": true + "name": "paddingInlineStart", + "value": "MaybeResponsive", + "description": "Adjust the inline-start padding.\n\nThis overrides the inline-start value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onHide", - "value": "(event: Event) => void", - "description": "A callback fired immediately after the overlay is hidden.", - "isOptional": true + "name": "placeContent", + "value": "MaybeResponsive<\n `${AlignContentKeyword} ${JustifyContentKeyword}` | AlignContentKeyword\n >", + "description": "A shorthand property for `justify-content` and `align-content`.", + "isOptional": true, + "defaultValue": "'normal normal'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onShow", - "value": "(event: Event) => void", - "description": "A callback fired immediately after the overlay is shown.", - "isOptional": true + "name": "placeItems", + "value": "MaybeResponsive<\n `${AlignItemsKeyword} ${JustifyItemsKeyword}` | AlignItemsKeyword\n >", + "description": "A shorthand property for `justify-items` and `align-items`.", + "isOptional": true, + "defaultValue": "'normal normal'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "padding", - "value": "'base' | 'none'", - "description": "Adjust the padding around the modal content.\n\n`base`: applies padding that is appropriate for the element.\n\n`none`: removes all padding from the element. This can be useful when elements inside the modal need to span to the edge of the modal. For example, a full-width image. In this case, rely on box with a padding of 'base' to bring back the desired padding for the rest of the content.", + "name": "rowGap", + "value": "MaybeResponsive", + "description": "Adjust spacing between elements in the block axis.\n\nThis overrides the row value of `gap`.", "isOptional": true, - "defaultValue": "'base'" - }, + "defaultValue": "'' - meaning no override" + } + ] + } + }, + "ResponsiveGridProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "ResponsiveGridProps", + "value": "MakeResponsivePick<\n RequiredAlignedProps,\n 'rowGap' | 'columnGap' | 'gap' | 'gridTemplateColumns' | 'gridTemplateRows'\n>", + "description": "The grid properties that support responsive values through container queries.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "primaryAction", - "value": "ComponentChildren", - "description": "The primary action button or link, representing the main or most important action available in this context. Typically displayed with higher visual prominence than secondary actions to establish clear hierarchy.", - "isOptional": true + "name": "columnGap", + "value": "MaybeResponsive", + "description": "Adjust spacing between elements in the inline axis.\n\nThis overrides the column value of `gap`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondaryActions", - "value": "ComponentChildren", - "description": "Additional action buttons or links that provide alternative or supporting actions. Visually de-emphasized compared to the primary action.", - "isOptional": true + "name": "gap", + "value": "MaybeResponsive>", + "description": "Adjust spacing between elements.\n\nA single value applies to both axes. A pair of values (eg `large-100 large-500`) can be used to set the inline and block axes respectively.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "showOverlay", - "value": "() => void", - "description": "A method to programmatically show the overlay." + "name": "gridTemplateColumns", + "value": "MaybeResponsive", + "description": "Define columns and specify their size.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "size", - "value": "SizeKeyword | 'max'", - "description": "Adjust the size of the modal.\n\n`max`: expands the modal to its maximum size as defined by the host application, on both the horizontal and vertical axes.", + "name": "gridTemplateRows", + "value": "MaybeResponsive", + "description": "Define rows and specify their size.", "isOptional": true, - "defaultValue": "'base'" + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "toggleOverlay", - "value": "() => void", - "description": "A method to programmatically toggle the visibility of the overlay." + "name": "rowGap", + "value": "MaybeResponsive", + "description": "Adjust spacing between elements in the block axis.\n\nThis overrides the row value of `gap`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" } ] } }, - "ContextCallback": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ContextCallback", - "description": "A callback which is provided by a context requester and is called with the value satisfying the request. This callback can be called multiple times by context providers as the requested value is changed.", - "isPublicDocs": true, - "params": [ - { - "name": "value", - "description": "", - "value": "T", - "filePath": "src/surfaces/admin/components.ts" - } - ], - "returns": { - "filePath": "src/surfaces/admin/components.ts", - "description": "", - "name": "void", - "value": "void" - }, - "value": "(value: T) => void" - } - }, - "Modal": { + "GridProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "Modal", - "description": "Configure the following properties on the modal component.", + "name": "GridProps", + "description": "The properties for the grid component. A grid provides precise control over rows and columns, with powerful alignment and sizing options for both individual items and the entire grid structure.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", + "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose of the modal. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nThis overrides the `heading` prop for screen readers." + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "heading", - "value": "string", - "description": "A title that describes the content of the modal." + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "padding", - "value": "\"base\" | \"none\"", - "description": "Adjust the padding around the modal content.\n\n`base`: applies padding that is appropriate for the element.\n\n`none`: removes all padding from the element. This can be useful when elements inside the modal need to span to the edge of the modal. For example, a full-width image. In this case, rely on box with a padding of 'base' to bring back the desired padding for the rest of the content.", - "defaultValue": "'base'" + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "size", - "value": "\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\"", - "description": "The size of the modal component, controlling its width and height. Larger sizes provide more space for content while smaller sizes are more compact.", - "defaultValue": "'base'" + "syntaxKind": "PropertySignature", + "name": "alignContent", + "value": "AlignContentKeyword | ''", + "description": "The alignment of the entire grid along the block axis when there's extra space in the grid container. This property overrides the block-axis value set by the `placeContent` property.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "showOverlay", - "value": "() => void", - "description": "A method to programmatically show the overlay." + "syntaxKind": "PropertySignature", + "name": "alignItems", + "value": "AlignItemsKeyword | ''", + "description": "The alignment of grid items along the block axis (vertical in horizontal writing modes). You can choose values like `'start'`, `'center'`, `'end'`, or `'stretch'` to control how items are positioned within their grid areas.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "hideOverlay", - "value": "() => void", - "description": "A method to programmatically hide the overlay." + "syntaxKind": "PropertySignature", + "name": "background", + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", + "defaultValue": "'transparent'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "toggleOverlay", - "value": "() => void", - "description": "A method to programmatically toggle the visibility of the overlay." + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@abortController@7234", - "value": "AbortController", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@dialog@7228", - "value": "HTMLDialogElement", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@focusedElement@7230", - "value": "HTMLElement", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@nestedModals@7232", - "value": "Map", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "columnGap", + "value": "MaybeResponsive<\"\" | SpacingKeyword>", + "description": "The spacing between grid columns. This property overrides the column spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@childrenRerenderObserver@7236", - "value": "MutationObserver", - "description": "", - "isPrivate": true - }, + "syntaxKind": "PropertySignature", + "name": "display", + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gap", + "value": "MaybeResponsive>", + "description": "The spacing between grid rows and columns. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value to apply the same spacing to both axes (for example, `'large-100'`), or a pair of values (for example, `'large-100 large-500'`) to set different spacing for rows and columns. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridTemplateColumns", + "value": "string", + "description": "The number of columns and their sizes. You can use [track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes) (for example, `'1fr auto'` or `'repeat(3, 1fr)'`) to define the grid structure. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridTemplateRows", + "value": "string", + "description": "The number of rows and their sizes. You can use [track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes) (for example, `'1fr auto'` or `'repeat(3, 100px)'`) to define the grid structure. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "justifyContent", + "value": "JustifyContentKeyword | ''", + "description": "The alignment of the entire grid along the inline axis when there's extra space in the grid container. This property overrides the inline-axis value set by the `placeContent` property.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "justifyItems", + "value": "JustifyItemsKeyword | ''", + "description": "The alignment of grid items along the inline axis (horizontal in left-to-right languages). You can choose values like `'start'`, `'center'`, or `'end'` to control how items are positioned within their grid areas.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "MaybeResponsive>", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlock", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInline", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeContent", + "value": "| `${AlignContentKeyword} ${JustifyContentKeyword}`\n | AlignContentKeyword", + "description": "A shorthand property for setting both `justifyContent` and `alignContent` at once. You can provide either a single value (which applies to both axes) or two values separated by a space (the first for `alignContent`, the second for `justifyContent`).", + "defaultValue": "'normal normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeItems", + "value": "`${AlignItemsKeyword} ${JustifyItemsKeyword}` | AlignItemsKeyword", + "description": "A shorthand property for setting both `justifyItems` and `alignItems` at once. You can provide either a single value (which applies to both axes) or two values separated by a space (the first for `alignItems`, the second for `justifyItems`).", + "defaultValue": "'normal normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "rowGap", + "value": "MaybeResponsive<\"\" | SpacingKeyword>", + "description": "The spacing between grid rows. This property overrides the row spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'' - meaning no override" + } + ], + "value": "export interface GridProps\n extends BoxProps,\n Required<\n Pick<\n GridProps$1,\n | 'alignItems'\n | 'justifyItems'\n | 'placeItems'\n | 'alignContent'\n | 'justifyContent'\n | 'placeContent'\n >\n > {\n /**\n * The alignment of grid items along the block axis (vertical in horizontal writing modes). You can choose values like `'start'`, `'center'`, `'end'`, or `'stretch'` to control how items are positioned within their grid areas.\n *\n * @default '' - meaning no override\n */\n alignItems: AlignItemsKeyword | '';\n /**\n * The alignment of grid items along the inline axis (horizontal in left-to-right languages). You can choose values like `'start'`, `'center'`, or `'end'` to control how items are positioned within their grid areas.\n *\n * @default '' - meaning no override\n */\n justifyItems: JustifyItemsKeyword | '';\n /**\n * A shorthand property for setting both `justifyItems` and `alignItems` at once. You can provide either a single value (which applies to both axes) or two values separated by a space (the first for `alignItems`, the second for `justifyItems`).\n *\n * @default 'normal normal'\n */\n placeItems: `${AlignItemsKeyword} ${JustifyItemsKeyword}` | AlignItemsKeyword;\n /**\n * The alignment of the entire grid along the block axis when there's extra space in the grid container. This property overrides the block-axis value set by the `placeContent` property.\n *\n * @default '' - meaning no override\n */\n alignContent: AlignContentKeyword | '';\n /**\n * The alignment of the entire grid along the inline axis when there's extra space in the grid container. This property overrides the inline-axis value set by the `placeContent` property.\n *\n * @default '' - meaning no override\n */\n justifyContent: JustifyContentKeyword | '';\n /**\n * A shorthand property for setting both `justifyContent` and `alignContent` at once. You can provide either a single value (which applies to both axes) or two values separated by a space (the first for `alignContent`, the second for `justifyContent`).\n *\n * @default 'normal normal'\n */\n placeContent:\n | `${AlignContentKeyword} ${JustifyContentKeyword}`\n | AlignContentKeyword;\n /**\n * The spacing between grid rows and columns. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value to apply the same spacing to both axes (for example, `'large-100'`), or a pair of values (for example, `'large-100 large-500'`) to set different spacing for rows and columns. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default 'none'\n */\n gap: ResponsiveGridProps['gap'];\n /**\n * The spacing between grid rows. This property overrides the row spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default '' - meaning no override\n */\n rowGap: ResponsiveGridProps['rowGap'];\n /**\n * The spacing between grid columns. This property overrides the column spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default '' - meaning no override\n */\n columnGap: ResponsiveGridProps['columnGap'];\n /**\n * The number of columns and their sizes. You can use [track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes) (for example, `'1fr auto'` or `'repeat(3, 1fr)'`) to define the grid structure. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default 'none'\n */\n gridTemplateColumns: ResponsiveGridProps['gridTemplateColumns'];\n /**\n * The number of rows and their sizes. You can use [track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes) (for example, `'1fr auto'` or `'repeat(3, 100px)'`) to define the grid structure. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default 'none'\n */\n gridTemplateRows: ResponsiveGridProps['gridTemplateRows'];\n}" + } + }, + "GridJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "GridJSXProps", + "description": "The properties for the grid component when it's used in JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "alignContent", + "value": "AlignContentKeyword | ''", + "description": "The alignment of the entire grid along the block axis when there's extra space in the grid container. This property overrides the block-axis value set by the `placeContent` property.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "alignItems", + "value": "AlignItemsKeyword | ''", + "description": "The alignment of grid items along the block axis (vertical in horizontal writing modes). You can choose values like `'start'`, `'center'`, `'end'`, or `'stretch'` to control how items are positioned within their grid areas.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "background", + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", + "defaultValue": "'transparent'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The child elements to render inside the grid.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "columnGap", + "value": "MaybeResponsive<\"\" | SpacingKeyword>", + "description": "The spacing between grid columns. This property overrides the column spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "display", + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gap", + "value": "MaybeResponsive>", + "description": "The spacing between grid rows and columns. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value to apply the same spacing to both axes (for example, `'large-100'`), or a pair of values (for example, `'large-100 large-500'`) to set different spacing for rows and columns. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridTemplateColumns", + "value": "string", + "description": "The number of columns and their sizes. You can use [track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes) (for example, `'1fr auto'` or `'repeat(3, 1fr)'`) to define the grid structure. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridTemplateRows", + "value": "string", + "description": "The number of rows and their sizes. You can use [track sizing values](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#fixed_and_flexible_track_sizes) (for example, `'1fr auto'` or `'repeat(3, 100px)'`) to define the grid structure. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "justifyContent", + "value": "JustifyContentKeyword | ''", + "description": "The alignment of the entire grid along the inline axis when there's extra space in the grid container. This property overrides the inline-axis value set by the `placeContent` property.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "justifyItems", + "value": "JustifyItemsKeyword | ''", + "description": "The alignment of grid items along the inline axis (horizontal in left-to-right languages). You can choose values like `'start'`, `'center'`, or `'end'` to control how items are positioned within their grid areas.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "MaybeResponsive>", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlock", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInline", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeContent", + "value": "| `${AlignContentKeyword} ${JustifyContentKeyword}`\n | AlignContentKeyword", + "description": "A shorthand property for setting both `justifyContent` and `alignContent` at once. You can provide either a single value (which applies to both axes) or two values separated by a space (the first for `alignContent`, the second for `justifyContent`).", + "defaultValue": "'normal normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeItems", + "value": "`${AlignItemsKeyword} ${JustifyItemsKeyword}` | AlignItemsKeyword", + "description": "A shorthand property for setting both `justifyItems` and `alignItems` at once. You can provide either a single value (which applies to both axes) or two values separated by a space (the first for `alignItems`, the second for `justifyItems`).", + "defaultValue": "'normal normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "rowGap", + "value": "MaybeResponsive<\"\" | SpacingKeyword>", + "description": "The spacing between grid rows. This property overrides the row spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'' - meaning no override" + } + ], + "value": "export interface GridJSXProps\n extends Partial,\n Pick {\n /**\n * The child elements to render inside the grid.\n */\n children?: ComponentChildren;\n}" + } + }, + "RequiredGridItemProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "RequiredGridItemProps", + "value": "Required", + "description": "A version of the grid item properties with all fields required.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "background", + "value": "BackgroundColorKeyword", + "description": "Adjust the background of the element.", + "isOptional": true, + "defaultValue": "'transparent'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "MaybeResponsive", + "description": "Adjust the block size.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "ColorKeyword | ''", + "description": "Set the color of the border.\n\nIf set, it takes precedence over the `border` property's color.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Set the radius of the border.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `start-start start-end end-end end-start`\n- 3 values: `start-start (start-end & end-start) start-end`\n- 2 values: `(start-start & end-end) (start-end & end-start)`\n\nFor example:\n- `small-100` means start-start, start-end, end-end and end-start border radii are `small-100`.\n- `small-100 none` means start-start and end-end border radii are `small-100`, start-end and end-start border radii are `none`.\n- `small-100 none large-100` means start-start border radius is `small-100`, start-end border radius is `none`, end-end border radius is `large-100` and end-start border radius is `none`.\n- `small-100 none large-100 small-100` means start-start border radius is `small-100`, start-end border radius is `none`, end-end border radius is `large-100` and end-start border radius is `small-100`.", + "isOptional": true, + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "MaybeAllValuesShorthandProperty | ''", + "description": "Set the style of the border.\n\nIf set, it takes precedence over the `border` property's style.\n\nLike CSS, up to 4 values can be specified.\n\nIf one value is specified, it applies to all sides.\n\nIf two values are specified, they apply to the block sides and inline sides respectively.\n\nIf three values are specified, they apply to the block-start, both inline sides, and block-end respectively.\n\nIf four values are specified, they apply to the block-start, block-end, inline-start, and inline-end sides respectively.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "MaybeAllValuesShorthandProperty | ''", + "description": "Set the width of the border.\n\nIf set, it takes precedence over the `border` property's width.\n\nLike CSS, up to 4 values can be specified.\n\nIf one value is specified, it applies to all sides.\n\nIf two values are specified, they apply to the block sides and inline sides respectively.\n\nIf three values are specified, they apply to the block-start, both inline sides, and block-end respectively.\n\nIf four values are specified, they apply to the block-start, block-end, inline-start, and inline-end sides respectively.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Box.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "display", + "value": "MaybeResponsive<'auto' | 'none'>", + "description": "Sets the outer display type of the component. The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridColumn", + "value": "`span ${number}` | 'auto'", + "description": "Number of columns the item will span across", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridRow", + "value": "`span ${number}` | 'auto'", + "description": "Number of rows the item will span across", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "MaybeResponsive", + "description": "Adjust the inline size.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "MaybeResponsive", + "description": "Adjust the maximum block size.", + "isOptional": true, + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "MaybeResponsive", + "description": "Adjust the maximum inline size.", + "isOptional": true, + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "MaybeResponsive", + "description": "Adjust the minimum block size.", + "isOptional": true, + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "MaybeResponsive", + "description": "Adjust the minimum inline size.", + "isOptional": true, + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "MaybeResponsive>", + "description": "Adjust the padding of all edges.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `block-start inline-end block-end inline-start`\n- 3 values: `block-start inline block-end`\n- 2 values: `block inline`\n\nFor example:\n- `large` means block-start, inline-end, block-end and inline-start paddings are `large`.\n- `large none` means block-start and block-end paddings are `large`, inline-start and inline-end paddings are `none`.\n- `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`.\n- `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`.\n\nA padding value of `auto` will use the default padding for the closest container that has had its usual padding removed.", + "isOptional": true, + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlock", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the block-padding.\n\n- `large none` means block-start padding is `large`, block-end padding is `none`.\n\nThis overrides the block value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockEnd", + "value": "MaybeResponsive", + "description": "Adjust the block-end padding.\n\nThis overrides the block-end value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockStart", + "value": "MaybeResponsive", + "description": "Adjust the block-start padding.\n\nThis overrides the block-start value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInline", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the inline padding.\n\n- `large none` means inline-start padding is `large`, inline-end padding is `none`.\n\nThis overrides the inline value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineEnd", + "value": "MaybeResponsive", + "description": "Adjust the inline-end padding.\n\nThis overrides the inline-end value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineStart", + "value": "MaybeResponsive", + "description": "Adjust the inline-start padding.\n\nThis overrides the inline-start value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + } + ] + } + }, + "GridItemProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "GridItemProps", + "description": "The properties for the grid item component. A grid item can be positioned within specific rows and columns of a grid, with control over how many rows or columns it spans.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "background", + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", + "defaultValue": "'transparent'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "display", + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridColumn", + "value": "\"auto\" | `span ${number}`", + "description": "The column position and span of the grid item. You can specify a starting column number, an ending column number, or both (for example, `'1 / 3'` starts at column 1 and ends before column 3, spanning 2 columns). You can also use `'span 2'` to make the item span 2 columns.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridRow", + "value": "\"auto\" | `span ${number}`", + "description": "The row position and span of the grid item. You can specify a starting row number, an ending row number, or both (for example, `'1 / 3'` starts at row 1 and ends before row 3, spanning 2 rows). You can also use `'span 2'` to make the item span 2 rows.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "MaybeResponsive>", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlock", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInline", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + } + ], + "value": "export interface GridItemProps\n extends BoxProps,\n Required> {\n /**\n * The column position and span of the grid item. You can specify a starting column number, an ending column number, or both (for example, `'1 / 3'` starts at column 1 and ends before column 3, spanning 2 columns). You can also use `'span 2'` to make the item span 2 columns.\n */\n gridColumn: RequiredGridItemProps['gridColumn'];\n /**\n * The row position and span of the grid item. You can specify a starting row number, an ending row number, or both (for example, `'1 / 3'` starts at row 1 and ends before row 3, spanning 2 rows). You can also use `'span 2'` to make the item span 2 rows.\n */\n gridRow: RequiredGridItemProps['gridRow'];\n}" + } + }, + "GridItemJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "GridItemJSXProps", + "description": "The properties for the grid item component when it's used in JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "background", + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", + "defaultValue": "'transparent'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The child elements to render inside the grid item.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "display", + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridColumn", + "value": "\"auto\" | `span ${number}`", + "description": "The column position and span of the grid item. You can specify a starting column number, an ending column number, or both (for example, `'1 / 3'` starts at column 1 and ends before column 3, spanning 2 columns). You can also use `'span 2'` to make the item span 2 columns.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gridRow", + "value": "\"auto\" | `span ${number}`", + "description": "The row position and span of the grid item. You can specify a starting row number, an ending row number, or both (for example, `'1 / 3'` starts at row 1 and ends before row 3, spanning 2 rows). You can also use `'span 2'` to make the item span 2 rows.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "MaybeResponsive>", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlock", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingBlockStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInline", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paddingInlineStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" + } + ], + "value": "export interface GridItemJSXProps\n extends Partial,\n Pick {\n /**\n * The child elements to render inside the grid item.\n */\n children?: ComponentChildren;\n}" + } + }, + "HeadingProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "HeadingProps", + "description": "The properties for the heading component. These properties define hierarchical section titles and headings with appropriate semantic meaning and visual hierarchy.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "'none' | 'presentation' | 'heading'", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `heading`: defines the element as a heading to a page or section.\n- `presentation`: the heading level will be stripped, and will prevent the element’s implicit ARIA semantics from being exposed to the accessibility tree.\n- `none`: a synonym for the `presentation` role.", + "isOptional": true, + "defaultValue": "'heading'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "lineClamp", + "value": "number", + "description": "Truncates the text content to the specified number of lines.", + "isOptional": true, + "defaultValue": "Infinity - no truncation is applied" + } + ], + "value": "export interface HeadingProps\n extends Required<\n Pick<\n HeadingProps$1,\n 'accessibilityRole' | 'accessibilityVisibility' | 'lineClamp'\n >\n > {}" + } + }, + "HeadingJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "HeadingJSXProps", + "description": "The JSX properties for the heading component. These properties define how a heading is rendered in Preact or JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "'none' | 'presentation' | 'heading'", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.\n\n- `heading`: defines the element as a heading to a page or section.\n- `presentation`: the heading level will be stripped, and will prevent the element’s implicit ARIA semantics from being exposed to the accessibility tree.\n- `none`: a synonym for the `presentation` role.", + "isOptional": true, + "defaultValue": "'heading'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the heading.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "lineClamp", + "value": "number", + "description": "Truncates the text content to the specified number of lines.", + "isOptional": true, + "defaultValue": "Infinity - no truncation is applied" + } + ], + "value": "export interface HeadingJSXProps\n extends Partial,\n Pick {\n /**\n * The content of the heading.\n */\n children?: ComponentChildren;\n}" + } + }, + "IconJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "IconJSXProps", + "description": "The properties for the icon component when it's used in JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "color", + "value": "'base' | 'subdued'", + "description": "The color emphasis of the icon. Use `'base'` for the standard color intensity, or `'subdued'` for a lighter, less prominent appearance.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "size", + "value": "'small' | 'base'", + "description": "The size of the icon. Use `'small'` for compact layouts, or `'base'` for standard sizing.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto' | 'neutral' | 'caution'", + "description": "The color tone of the icon based on its semantic meaning. Choose from `'auto'` to let the icon inherit its context, `'neutral'` for standard icons, `'info'` for informational content, `'success'` for positive actions, `'caution'` or `'warning'` for warnings, or `'critical'` for errors.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "type", + "value": "'' | IconType | 'empty'", + "description": "The type of icon that will be displayed. You can specify an icon name from the available icon set, or use an empty string to show no icon." + } + ], + "value": "export interface IconJSXProps\n extends Partial,\n Pick {}" + } + }, + "ImageProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ImageProps", + "description": "The properties for the image component. An image displays pictures with configurable sizing, loading behavior, and borders. Properties include `src` for the image URL, `alt` for accessibility text, `aspectRatio` for sizing, `loading` for lazy loading, and border styling options.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "'none' | 'presentation' | 'img'", + "description": "The accessibility role for the image. Set this to provide semantic meaning for screen readers.", + "defaultValue": "'img'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "alt", + "value": "string", + "description": "Alternative text that describes the image for screen readers. This text should convey the meaning or content of the image to users who can't see it.", + "defaultValue": "`''`" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "aspectRatio", + "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", + "description": "The aspect ratio of the image as a width-to-height ratio (for example, `'16/9'` or `'1'`). This helps prevent layout shifts while the image loads.", + "defaultValue": "'1/1'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Whether to show a border around the image. Set to `true` to display a border, or `false` to hide it.", + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "\"\" | ColorKeyword", + "description": "The color of the border around the image. Choose from `'subdued'`, `'base'`, or `'strong'` to control the visual emphasis.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image. You can use a single value to apply the same radius to all corners, or use the 1-to-4-value syntax to control individual corners.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image. You can use a single value to apply the same style to all sides, or use the 1-to-4-value syntax to control individual sides.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image. You can use a single value to apply the same width to all sides, or use the 1-to-4-value syntax to control individual sides.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "'auto' | 'fill'", + "description": "The inline size (width in horizontal writing modes) of the image. You can use size units like `'100px'` or `'50%'`.", + "defaultValue": "'fill'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "loading", + "value": "'eager' | 'lazy'", + "description": "When the image should be loaded. Use `'lazy'` to defer loading until the image is near the viewport, or `'eager'` to load immediately.", + "defaultValue": "'eager'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "objectFit", + "value": "'contain' | 'cover'", + "description": "How the image should be resized to fit its container. Choose `'cover'` to fill the container while maintaining aspect ratio (cropping if needed), or `'contain'` to fit the entire image within the container.", + "defaultValue": "'contain'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "sizes", + "value": "string", + "description": "The sizes of the image at different viewport widths. Use this with `srcSet` to tell the browser which image to load (for example, `'(max-width: 320px) 280px, 640px'`)." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "src", + "value": "string", + "description": "The URL of the image to display. You can provide an absolute or relative URL pointing to the image file." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "srcSet", + "value": "string", + "description": "A set of source images with different sizes for responsive loading. Use this to provide multiple image sizes for different screen resolutions (for example, `'image-320w.jpg 320w, image-640w.jpg 640w'`)." + } + ], + "value": "export interface ImageProps\n extends Required<\n Pick<\n ImageProps$1,\n | 'alt'\n | 'loading'\n | 'src'\n | 'accessibilityRole'\n | 'inlineSize'\n | 'srcSet'\n | 'sizes'\n | 'aspectRatio'\n | 'objectFit'\n >\n >,\n Required<\n Pick<\n BoxProps,\n | 'border'\n | 'borderColor'\n | 'borderRadius'\n | 'borderStyle'\n | 'borderWidth'\n >\n > {\n /**\n * The URL of the image to display. You can provide an absolute or relative URL pointing to the image file.\n */\n src: ImageProps$1['src'];\n /**\n * A set of source images with different sizes for responsive loading. Use this to provide multiple image sizes for different screen resolutions (for example, `'image-320w.jpg 320w, image-640w.jpg 640w'`).\n */\n srcSet: ImageProps$1['srcSet'];\n /**\n * The sizes of the image at different viewport widths. Use this with `srcSet` to tell the browser which image to load (for example, `'(max-width: 320px) 280px, 640px'`).\n */\n sizes: ImageProps$1['sizes'];\n /**\n * Alternative text that describes the image for screen readers. This text should convey the meaning or content of the image to users who can't see it.\n */\n alt: ImageProps$1['alt'];\n /**\n * The aspect ratio of the image as a width-to-height ratio (for example, `'16/9'` or `'1'`). This helps prevent layout shifts while the image loads.\n */\n aspectRatio: ImageProps$1['aspectRatio'];\n /**\n * How the image should be resized to fit its container. Choose `'cover'` to fill the container while maintaining aspect ratio (cropping if needed), or `'contain'` to fit the entire image within the container.\n */\n objectFit: ImageProps$1['objectFit'];\n /**\n * When the image should be loaded. Use `'lazy'` to defer loading until the image is near the viewport, or `'eager'` to load immediately.\n */\n loading: ImageProps$1['loading'];\n /**\n * The accessibility role for the image. Set this to provide semantic meaning for screen readers.\n */\n accessibilityRole: ImageProps$1['accessibilityRole'];\n /**\n * The inline size (width in horizontal writing modes) of the image. You can use size units like `'100px'` or `'50%'`.\n */\n inlineSize: ImageProps$1['inlineSize'];\n /**\n * Whether to show a border around the image. Set to `true` to display a border, or `false` to hide it.\n */\n border: ImageProps$1['border'];\n /**\n * The width of the border around the image. You can use a single value to apply the same width to all sides, or use the 1-to-4-value syntax to control individual sides.\n */\n borderWidth: ImageProps$1['borderWidth'];\n /**\n * The style of the border around the image. You can use a single value to apply the same style to all sides, or use the 1-to-4-value syntax to control individual sides.\n */\n borderStyle: ImageProps$1['borderStyle'];\n /**\n * The color of the border around the image. Choose from `'subdued'`, `'base'`, or `'strong'` to control the visual emphasis.\n */\n borderColor: ImageProps$1['borderColor'];\n /**\n * The radius of the border corners around the image. You can use a single value to apply the same radius to all corners, or use the 1-to-4-value syntax to control individual corners.\n */\n borderRadius: ImageProps$1['borderRadius'];\n}" + } + }, + "ImageJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ImageJSXProps", + "description": "The properties for the image component when it's used in JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "'none' | 'presentation' | 'img'", + "description": "The accessibility role for the image. Set this to provide semantic meaning for screen readers.", + "defaultValue": "'img'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "alt", + "value": "string", + "description": "Alternative text that describes the image for screen readers. This text should convey the meaning or content of the image to users who can't see it.", + "defaultValue": "`''`" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "aspectRatio", + "value": "`${number}` | `${number}/${number}` | `${number}/ ${number}` | `${number} /${number}` | `${number} / ${number}`", + "description": "The aspect ratio of the image as a width-to-height ratio (for example, `'16/9'` or `'1'`). This helps prevent layout shifts while the image loads.", + "defaultValue": "'1/1'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Whether to show a border around the image. Set to `true` to display a border, or `false` to hide it.", + "defaultValue": "'none' - equivalent to `none base auto`." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "\"\" | ColorKeyword", + "description": "The color of the border around the image. Choose from `'subdued'`, `'base'`, or `'strong'` to control the visual emphasis.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "The radius of the border corners around the image. You can use a single value to apply the same radius to all corners, or use the 1-to-4-value syntax to control individual corners.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The style of the border around the image. You can use a single value to apply the same style to all sides, or use the 1-to-4-value syntax to control individual sides.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "The width of the border around the image. You can use a single value to apply the same width to all sides, or use the 1-to-4-value syntax to control individual sides.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "'auto' | 'fill'", + "description": "The inline size (width in horizontal writing modes) of the image. You can use size units like `'100px'` or `'50%'`.", + "defaultValue": "'fill'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "loading", + "value": "'eager' | 'lazy'", + "description": "When the image should be loaded. Use `'lazy'` to defer loading until the image is near the viewport, or `'eager'` to load immediately.", + "defaultValue": "'eager'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "objectFit", + "value": "'contain' | 'cover'", + "description": "How the image should be resized to fit its container. Choose `'cover'` to fill the container while maintaining aspect ratio (cropping if needed), or `'contain'` to fit the entire image within the container.", + "defaultValue": "'contain'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onError", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired when the image fails to load.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onLoad", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired when the image has loaded successfully.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "sizes", + "value": "string", + "description": "The sizes of the image at different viewport widths. Use this with `srcSet` to tell the browser which image to load (for example, `'(max-width: 320px) 280px, 640px'`)." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "src", + "value": "string", + "description": "The URL of the image to display. You can provide an absolute or relative URL pointing to the image file." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "srcSet", + "value": "string", + "description": "A set of source images with different sizes for responsive loading. Use this to provide multiple image sizes for different screen resolutions (for example, `'image-320w.jpg 320w, image-640w.jpg 640w'`)." + } + ], + "value": "export interface ImageJSXProps\n extends Partial,\n Pick {\n /**\n * A callback that's fired when the image fails to load.\n */\n onError?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's fired when the image has loaded successfully.\n */\n onLoad?: ((event: CallbackEvent) => void) | null;\n}" + } + }, + "RequiredLinkProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "RequiredLinkProps", + "value": "Required", + "description": "*", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Link.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "commandFor", + "value": "string", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onBlur", + "value": "(event: FocusEvent) => void", + "description": "Callback when the element loses focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onClick", + "value": "(event: Event) => void", + "description": "Callback when the link is activated. This will be called before navigating to the location specified by `href`.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onFocus", + "value": "(event: FocusEvent) => void", + "description": "Callback when the element receives focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "target", + "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", + "description": "Specifies where to display the linked URL.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "ToneKeyword", + "description": "Sets the tone of the Link, based on the intention of the information being conveyed.", + "isOptional": true, + "defaultValue": "'auto'" + } + ] + } + }, + "LinkProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "LinkProps", + "description": "The properties for the link component. These properties define a clickable link that navigates users to different pages or sections with customizable visual styles and semantic meaning.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "commandFor", + "value": "string", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "target", + "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", + "description": "Specifies where to display the linked URL.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'critical' | 'auto' | 'neutral'", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", + "defaultValue": "'auto'" + } + ], + "value": "export interface LinkProps extends LinkBaseProps {\n /**\n * The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n * - `'auto'` - The system automatically chooses the appropriate tone based on context.\n * - `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n * - `'critical'` - Red styling for links that lead to destructive actions or important warnings.\n *\n * @default 'auto'\n */\n tone: Extract;\n}" + } + }, + "LinkJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "LinkJSXProps", + "description": "The JSX properties for the link component. These properties define how a link is rendered in Preact or JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the Link. It will be read to users using assistive technologies such as screen readers.\n\nUse this when using only an icon or the content of the link is not enough context for users using assistive technologies.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The text or content to display inside the link. This typically describes the destination or action the link performs.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "command", + "value": "'--auto' | '--show' | '--hide' | '--toggle' | '--copy'", + "description": "Sets the action the `commandFor` should take when this clickable is activated.\n\nSee the documentation of particular components for the actions they support.\n\n- `--auto`: a default action for the target component.\n- `--show`: shows the target component.\n- `--hide`: hides the target component.\n- `--toggle`: toggles the target component.\n- `--copy`: copies the target ClipboardItem.", + "isOptional": true, + "defaultValue": "'--auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "commandFor", + "value": "string", + "description": "ID of a component that should respond to activations (e.g. clicks) on this component.\n\nSee `command` for how to control the behavior of the target.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "download", + "value": "string", + "description": "Causes the browser to treat the linked URL as a download with the string being the file name. Download only works for same-origin URLs or the `blob:` and `data:` schemes.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "href", + "value": "string", + "description": "The URL to link to.\n\n- If set, it will navigate to the location specified by `href` after executing the `click` event.\n- If a `commandFor` is set, the `command` will be executed instead of the navigation.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "lang", + "value": "string", + "description": "Indicate the text language. Useful when the text is in a different language than the rest of the page. It will allow assistive technologies such as screen readers to invoke the correct pronunciation. [Reference of values](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) (\"subtag\" label)", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onClick", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback function that's invoked when the link is clicked. It receives the click event as an argument.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "target", + "value": "'auto' | '_blank' | '_self' | '_parent' | '_top' | AnyString", + "description": "Specifies where to display the linked URL.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'critical' | 'auto' | 'neutral'", + "description": "The visual appearance and semantic meaning of the link. Links rely on the tone system for semantic meaning, so using custom styling might not clearly convey intent to merchants. Available options:\n- `'auto'` - The system automatically chooses the appropriate tone based on context.\n- `'neutral'` - Standard styling for general navigation without specific semantic meaning.\n- `'critical'` - Red styling for links that lead to destructive actions or important warnings.", + "defaultValue": "'auto'" + } + ], + "value": "export interface LinkJSXProps\n extends Partial,\n Pick {\n /**\n * The text or content to display inside the link. This typically describes the destination or action the link performs.\n */\n children?: ComponentChildren;\n /**\n * A callback function that's invoked when the link is clicked. It receives the click event as an argument.\n */\n onClick?: ((event: CallbackEvent) => void) | null;\n}" + } + }, + "ListItemProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ListItemProps", + "description": "The properties that you can set on a list item component.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the ListItem.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface ListItemProps extends ListItemProps$1 {}" + } + }, + "ListItemJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ListItemJSXProps", + "description": "The JSX properties you can set on a list item component.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content to display inside the list item.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface ListItemJSXProps\n extends Partial,\n Pick {\n /**\n * The content to display inside the list item.\n */\n children?: ComponentChildren;\n}" + } + }, + "MenuProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "MenuProps", + "description": "The properties you can set on a menu component.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced using assistive technologies and provide additional context.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface MenuProps\n extends Required> {}" + } + }, + "MenuJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "MenuJSXProps", + "description": "The JSX properties you can set on a menu component.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced using assistive technologies and provide additional context.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The menu items to display, which should include button and section components.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface MenuJSXProps\n extends Partial,\n Pick {\n /**\n * The menu items to display, which should include button and section components.\n */\n children?: ComponentChildren;\n}" + } + }, + "RequiredAlignedModalProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "RequiredAlignedModalProps", + "value": "Required", + "description": "*", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose of the modal. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nThis overrides the `heading` prop for screen readers.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Modal.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "heading", + "value": "string", + "description": "A title that describes the content of the Modal.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "hideOverlay", + "value": "() => void", + "description": "Method to hide an overlay." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onAfterHide", + "value": "(event: Event) => void", + "description": "Callback fired when the overlay is hidden **after** any animations to hide the overlay have finished.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onAfterShow", + "value": "(event: Event) => void", + "description": "Callback fired when the overlay is shown **after** any animations to show the overlay have finished.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onHide", + "value": "(event: Event) => void", + "description": "Callback fired after the overlay is hidden.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onShow", + "value": "(event: Event) => void", + "description": "Callback fired after the overlay is shown.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "'base' | 'none'", + "description": "Adjust the padding around the Modal content.\n\n`base`: applies padding that is appropriate for the element.\n\n`none`: removes all padding from the element. This can be useful when elements inside the Modal need to span to the edge of the Modal. For example, a full-width image. In this case, rely on `Box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "isOptional": true, + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "primaryAction", + "value": "ComponentChildren", + "description": "The primary action to perform, provided as a button or link type element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "secondaryActions", + "value": "ComponentChildren", + "description": "The secondary actions to perform, provided as button or link type elements.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "showOverlay", + "value": "() => void", + "description": "Method to show an overlay." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "size", + "value": "SizeKeyword | 'max'", + "description": "Adjust the size of the Modal.\n\n`max`: expands the Modal to its maximum size as defined by the host application, on both the horizontal and vertical axes.", + "isOptional": true, + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "toggleOverlay", + "value": "() => void", + "description": "Method to toggle the visiblity of an overlay." + } + ] + } + }, + "RequiredMoneyFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "RequiredMoneyFieldProps", + "value": "Required", + "description": "The required properties from the `MoneyFieldProps$1` definition. This type ensures all properties from the shared definition are marked as required.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "autocomplete", + "value": "| AutocompleteField\n | `${AutocompleteSection} ${AutocompleteField}`\n | `${AutocompleteGroup} ${AutocompleteField}`\n | `${AutocompleteSection} ${AutocompleteGroup} ${AutocompleteField}`\n | 'on'\n | 'off'", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "isOptional": true, + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "controls", + "value": "'auto' | 'stepper' | 'none'", + "description": "Sets the type of controls displayed in the field.\n\n- `stepper`: displays buttons to increase or decrease the value of the field by the stepping interval defined in the `step` property. Appropriate mouse and [keyboard interactions](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/spinbutton_role#keyboard_interactions) to control the value of the field are enabled.\n- `none`: no controls are displayed and users must input the value manually. Arrow keys and scroll wheels can’t be used either to avoid accidental changes.\n- `auto`: the presence of the controls depends on the surface and context.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "currencyCode", + "value": "CurrencyCode | 'auto'", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "max", + "value": "number", + "description": "The highest decimal or integer to be accepted for the field. When used with `step` the value will round down to the max number.\n\nNote: a user will still be able to use the keyboard to input a number higher than the max. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "min", + "value": "number", + "description": "The lowest decimal or integer to be accepted for the field. When used with `step` the value will round up to the min number.\n\nNote: a user will still be able to use the keyboard to input a number lower than the min. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "-Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onBlur", + "value": "(event: FocusEvent) => void", + "description": "Callback when the element loses focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onChange", + "value": "(event: Event) => void", + "description": "Callback when the user has **finished editing** a field, e.g. once they have blurred the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onFocus", + "value": "(event: FocusEvent) => void", + "description": "Callback when the element receives focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onInput", + "value": "(event: Event) => void", + "description": "Callback when the user makes any changes in the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "step", + "value": "number", + "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "isOptional": true, + "defaultValue": "1" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", + "isOptional": true + } + ] + } + }, + "AutocompleteSection": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "AutocompleteSection", + "value": "`section-${string}`", + "description": "The “section” scopes the autocomplete data that should be inserted to a specific area of the page.\n\nCommonly used when there are multiple fields with the same autocomplete needs in the same page. For example: 2 shipping address forms in the same page." + } + }, + "AutocompleteGroup": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "AutocompleteGroup", + "value": "'shipping' | 'billing'", + "description": "The contact information group the autocomplete data should be sourced from." + } + }, + "MoneyFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "MoneyFieldProps", + "description": "The properties for the money field component. These properties configure a specialized input field for entering monetary amounts with automatic currency formatting, decimal handling, and range validation.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "currencyCode", + "value": "CurrencyCode | 'auto'", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "max", + "value": "number", + "description": "The highest decimal or integer to be accepted for the field. When used with `step` the value will round down to the max number.\n\nNote: a user will still be able to use the keyboard to input a number higher than the max. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "min", + "value": "number", + "description": "The lowest decimal or integer to be accepted for the field. When used with `step` the value will round up to the min number.\n\nNote: a user will still be able to use the keyboard to input a number lower than the min. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "-Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current monetary value for the field, represented as a string." + } + ], + "value": "export interface MoneyFieldProps\n extends Omit,\n Pick {\n /**\n * The current monetary value for the field, represented as a string.\n */\n value: Required['value'];\n}" + } + }, + "MoneyFieldJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "MoneyFieldJSXProps", + "description": "The JSX props for the money field component. These properties extend `MoneyFieldProps` with JSX-specific event callbacks for React-style event handling when used in Preact.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "currencyCode", + "value": "CurrencyCode | 'auto'", + "description": "The currency code of the field.\n\nWhen set to 'auto', the field will display the currency code of the shop. If no currency code is set for the shop, resolve to 'XXX' the explicit non value.\n\nThis value will match the global currency code of the shop, so if you need to know the currency code of the field, you can read the value from those APIs.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "max", + "value": "number", + "description": "The highest decimal or integer to be accepted for the field. When used with `step` the value will round down to the max number.\n\nNote: a user will still be able to use the keyboard to input a number higher than the max. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "min", + "value": "number", + "description": "The lowest decimal or integer to be accepted for the field. When used with `step` the value will round up to the min number.\n\nNote: a user will still be able to use the keyboard to input a number lower than the min. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "-Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user has finished editing the field, such as when they blur the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user makes changes to the field value. This fires before `onChange`.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current monetary value for the field, represented as a string." + } + ], + "value": "export interface MoneyFieldJSXProps\n extends Partial>,\n FieldReactProps,\n Pick,\n FieldSlotInternalReactProps {}" + } + }, + "NumberFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "NumberFieldProps", + "description": "The properties for the number field component. These properties configure a specialized input field for entering numeric values with support for validation, formatting, range constraints, and optimized mobile input modes.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inputMode", + "value": "'decimal' | 'numeric'", + "description": "Sets the virtual keyboard.", + "isOptional": true, + "defaultValue": "'decimal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "max", + "value": "number", + "description": "The highest decimal or integer to be accepted for the field. When used with `step` the value will round down to the max number.\n\nNote: a user will still be able to use the keyboard to input a number higher than the max. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "min", + "value": "number", + "description": "The lowest decimal or integer to be accepted for the field. When used with `step` the value will round up to the min number.\n\nNote: a user will still be able to use the keyboard to input a number lower than the min. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "-Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "prefix", + "value": "string", + "description": "A value to be displayed immediately before the editable portion of the field.\n\nThis is useful for displaying an implied part of the value, such as \"https://\" or \"+353\".\n\nThis cannot be edited by the user, and it isn't included in the value of the field.\n\nIt may not be displayed until the user has interacted with the input. For example, an inline label may take the place of the prefix until the user focuses the input.", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "step", + "value": "number", + "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "isOptional": true, + "defaultValue": "1" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "suffix", + "value": "string", + "description": "A value to be displayed immediately after the editable portion of the field.\n\nThis is useful for displaying an implied part of the value, such as \"@shopify.com\", or \"%\".\n\nThis cannot be edited by the user, and it isn't included in the value of the field.\n\nIt may not be displayed until the user has interacted with the input. For example, an inline label may take the place of the suffix until the user focuses the input.", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current value for the field, represented as a string." + } + ], + "value": "export interface NumberFieldProps\n extends Omit<\n PreactFieldProps['autocomplete']>,\n 'value'\n >,\n Required<\n Pick<\n NumberFieldProps$1,\n 'inputMode' | 'max' | 'min' | 'prefix' | 'step' | 'suffix'\n >\n > {\n /**\n * The current value for the field, represented as a string.\n */\n value: Required['value'];\n}" + } + }, + "NumberFieldJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "NumberFieldJSXProps", + "description": "The JSX props for the number field component. These properties extend `NumberFieldProps` with JSX-specific event callbacks for React-style event handling when used in Preact.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inputMode", + "value": "'decimal' | 'numeric'", + "description": "Sets the virtual keyboard.", + "isOptional": true, + "defaultValue": "'decimal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "max", + "value": "number", + "description": "The highest decimal or integer to be accepted for the field. When used with `step` the value will round down to the max number.\n\nNote: a user will still be able to use the keyboard to input a number higher than the max. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "min", + "value": "number", + "description": "The lowest decimal or integer to be accepted for the field. When used with `step` the value will round up to the min number.\n\nNote: a user will still be able to use the keyboard to input a number lower than the min. It is up to the developer to add appropriate validation.", + "isOptional": true, + "defaultValue": "-Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user has finished editing the field, such as when they blur the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user makes changes to the field value. This fires before `onChange`.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "prefix", + "value": "string", + "description": "A value to be displayed immediately before the editable portion of the field.\n\nThis is useful for displaying an implied part of the value, such as \"https://\" or \"+353\".\n\nThis cannot be edited by the user, and it isn't included in the value of the field.\n\nIt may not be displayed until the user has interacted with the input. For example, an inline label may take the place of the prefix until the user focuses the input.", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "step", + "value": "number", + "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", + "isOptional": true, + "defaultValue": "1" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "suffix", + "value": "string", + "description": "A value to be displayed immediately after the editable portion of the field.\n\nThis is useful for displaying an implied part of the value, such as \"@shopify.com\", or \"%\".\n\nThis cannot be edited by the user, and it isn't included in the value of the field.\n\nIt may not be displayed until the user has interacted with the input. For example, an inline label may take the place of the suffix until the user focuses the input.", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current value for the field, represented as a string." + } + ], + "value": "export interface NumberFieldJSXProps\n extends Partial>,\n Pick,\n FieldReactProps,\n FieldSlotInternalReactProps {}" + } + }, + "OptionProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "OptionProps", + "description": "Properties for rendering a single option within a select dropdown that users can choose from.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultSelected", + "value": "boolean", + "description": "Whether the control is active by default.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the control, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "selected", + "value": "boolean", + "description": "Whether the control is active.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The value used in form data when the control is checked.", + "isOptional": true + } + ], + "value": "export interface OptionProps\n extends Required<\n Pick\n > {}" + } + }, + "OptionJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "OptionJSXProps", + "description": "Properties for using the option component in JSX with React-style props.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content that's used as the option label, displayed in the dropdown list.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultSelected", + "value": "boolean", + "description": "Whether the control is active by default.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the control, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "selected", + "value": "boolean", + "description": "Whether the control is active.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The value used in form data when the control is checked.", + "isOptional": true + } + ], + "value": "export interface OptionJSXProps\n extends Partial,\n Pick {\n /**\n * The content that's used as the option label, displayed in the dropdown list.\n */\n children?: ComponentChildren;\n}" + } + }, + "OptionGroupProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "OptionGroupProps", + "description": "Properties for rendering a group of related options within a select dropdown, organized under a shared label.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Whether the options within this group can be selected or not.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string", + "description": "The user-facing label for this group of options.", + "isOptional": true + } + ], + "value": "export interface OptionGroupProps\n extends Required> {}" + } + }, + "OptionGroupJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "OptionGroupJSXProps", + "description": "Properties for using the option group component in JSX with React-style props.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The selectable options displayed in the dropdown list. Accepts option components for individual selectable items within this group.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Whether the options within this group can be selected or not.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string", + "description": "The user-facing label for this group of options.", + "isOptional": true + } + ], + "value": "export interface OptionGroupJSXProps\n extends Partial,\n Pick {\n /**\n * The selectable options displayed in the dropdown list. Accepts option components for individual selectable items within this group.\n */\n children?: ComponentChildren;\n}" + } + }, + "OrderedListProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "OrderedListProps", + "description": "The properties for the ordered list component. These properties define a numbered list of items with automatic numbering and proper list semantics.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the OrderededList.\n\nAccepts only `ListItem` components.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface OrderedListProps extends OrderedListProps$1 {}" + } + }, + "OrderedListJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "OrderedListJSXProps", + "description": "The JSX properties for the ordered list component. These properties define how an ordered list is rendered in Preact or JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The items in the ordered list. Only list item components are accepted.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface OrderedListJSXProps\n extends Partial,\n Pick {\n /**\n * The items in the ordered list. Only list item components are accepted.\n */\n children?: ComponentChildren;\n}" + } + }, + "ParagraphProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ParagraphProps", + "description": "The properties for the paragraph component. These properties define blocks of text content with consistent spacing and styling for readable body copy.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "color", + "value": "'base' | 'subdued'", + "description": "The color of the paragraph text. Available options:\n- `'base'` - The default text color.\n- `'subdued'` - A lighter text color for secondary information.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "dir", + "value": "'ltr' | 'rtl' | 'auto' | ''", + "description": "Indicates the directionality of the element’s text.\n\n- `ltr`: languages written from left to right (e.g. English)\n- `rtl`: languages written from right to left (e.g. Arabic)\n- `auto`: the user agent determines the direction based on the content\n- `''`: direction is inherited from parent elements (equivalent to not setting the attribute)", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "fontVariantNumeric", + "value": "'auto' | 'normal' | 'tabular-nums'", + "description": "Set the numeric properties of the font.", + "isOptional": true, + "defaultValue": "'auto' - inherit from the parent element" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "lineClamp", + "value": "number", + "description": "Truncates the text content to the specified number of lines.", + "isOptional": true, + "defaultValue": "Infinity - no truncation is applied" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto' | 'neutral' | 'caution'", + "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", + "defaultValue": "'auto'" + } + ], + "value": "export interface ParagraphProps\n extends Required<\n Pick<\n ParagraphProps$1,\n | 'accessibilityVisibility'\n | 'fontVariantNumeric'\n | 'tone'\n | 'dir'\n | 'color'\n | 'lineClamp'\n >\n > {\n /**\n * The color of the paragraph text. Available options:\n * - `'base'` - The default text color.\n * - `'subdued'` - A lighter text color for secondary information.\n */\n color: Extract;\n /**\n * The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `caution`: Advisory notices that need attention (yellow).\n */\n tone: Extract<\n ParagraphProps$1['tone'],\n 'auto' | 'neutral' | 'info' | 'success' | 'caution' | 'warning' | 'critical'\n >;\n}" + } + }, + "ParagraphJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "ParagraphJSXProps", + "description": "The JSX properties for the paragraph component. These properties define how a paragraph is rendered in Preact or JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the paragraph.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "color", + "value": "'base' | 'subdued'", + "description": "The color of the paragraph text. Available options:\n- `'base'` - The default text color.\n- `'subdued'` - A lighter text color for secondary information.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "dir", + "value": "'ltr' | 'rtl' | 'auto' | ''", + "description": "Indicates the directionality of the element’s text.\n\n- `ltr`: languages written from left to right (e.g. English)\n- `rtl`: languages written from right to left (e.g. Arabic)\n- `auto`: the user agent determines the direction based on the content\n- `''`: direction is inherited from parent elements (equivalent to not setting the attribute)", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "fontVariantNumeric", + "value": "'auto' | 'normal' | 'tabular-nums'", + "description": "Set the numeric properties of the font.", + "isOptional": true, + "defaultValue": "'auto' - inherit from the parent element" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "lineClamp", + "value": "number", + "description": "Truncates the text content to the specified number of lines.", + "isOptional": true, + "defaultValue": "Infinity - no truncation is applied" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto' | 'neutral' | 'caution'", + "description": "The semantic tone that's applied to the paragraph text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `caution`: Advisory notices that need attention (yellow).", + "defaultValue": "'auto'" + } + ], + "value": "export interface ParagraphJSXProps\n extends Partial,\n Pick {\n /**\n * The content of the paragraph.\n */\n children?: ComponentChildren;\n}" + } + }, + "PasswordFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "PasswordFieldProps", + "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required<\n Pick<\n PasswordFieldProps$1,\n | 'defaultValue'\n | 'details'\n | 'disabled'\n | 'error'\n | 'labelAccessibilityVisibility'\n | 'minLength'\n | 'maxLength'\n | 'label'\n | 'name'\n | 'placeholder'\n | 'readOnly'\n | 'required'\n | 'value'\n >\n >", + "description": "The properties for the password field component. These properties configure a secure input field that collects sensitive password input from merchants with masked characters.", + "isPublicDocs": true + } + }, + "PasswordFieldJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "PasswordFieldJSXProps", + "description": "The JSX props for the password field component. These properties extend `PasswordFieldProps` with JSX-specific event callbacks for React-style event handling when used in Preact.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxLength", + "value": "number", + "description": "Specifies the maximum number of characters allowed.", + "isOptional": true, + "defaultValue": "Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minLength", + "value": "number", + "description": "Specifies the min number of characters allowed.", + "isOptional": true, + "defaultValue": "0" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user has finished editing the field, such as when they blur the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user makes changes to the field value. This fires before `onChange`.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", + "isOptional": true + } + ], + "value": "export interface PasswordFieldJSXProps\n extends Partial>,\n Pick,\n FieldReactProps,\n FieldSlotInternalReactProps {}" + } + }, + "QueryContainerProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "QueryContainerProps", + "description": "The properties you can set on a query container component.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "containerName", + "value": "string", + "description": "The name of the container, which can be used in your container queries to target this container specifically.\n\nWe place the container name of `s-default` on every container. Because of this, it is not required to add a `containerName` identifier in your queries. For example, a `@container (inline-size <= 300px) none, auto` query is equivalent to `@container s-default (inline-size <= 300px) none, auto`.\n\nAny value set in `containerName` will be set alongside alongside `s-default`. For example, `containerName=\"my-container-name\"` will result in a value of `s-default my-container-name` set on the `container-name` CSS property of the rendered HTML.", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface QueryContainerProps\n extends Required> {}" + } + }, + "QueryContainerJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "QueryContainerJSXProps", + "description": "The JSX properties you can set on a query container component.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content to display inside the container.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "containerName", + "value": "string", + "description": "The name of the container, which can be used in your container queries to target this container specifically.\n\nWe place the container name of `s-default` on every container. Because of this, it is not required to add a `containerName` identifier in your queries. For example, a `@container (inline-size <= 300px) none, auto` query is equivalent to `@container s-default (inline-size <= 300px) none, auto`.\n\nAny value set in `containerName` will be set alongside alongside `s-default`. For example, `containerName=\"my-container-name\"` will result in a value of `s-default my-container-name` set on the `container-name` CSS property of the rendered HTML.", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface QueryContainerJSXProps\n extends Partial,\n Pick {\n /**\n * The content to display inside the container.\n */\n children?: ComponentChildren;\n}" + } + }, + "SearchFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "SearchFieldProps", + "value": "PreactFieldProps<\n /**\n * @default 'on'\n */\n Required['autocomplete']\n> & Required<\n Pick<\n TextFieldProps$1,\n | 'defaultValue'\n | 'details'\n | 'disabled'\n | 'error'\n | 'labelAccessibilityVisibility'\n | 'minLength'\n | 'maxLength'\n | 'label'\n | 'name'\n | 'placeholder'\n | 'readOnly'\n | 'required'\n | 'value'\n >\n >", + "description": "Properties for rendering a search field that lets users enter search queries with validation constraints and autofill support.", + "isPublicDocs": true + } + }, + "SearchFieldJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SearchFieldJSXProps", + "description": "Props for using the search field component in JSX with React-style event handlers.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxLength", + "value": "number", + "description": "Specifies the maximum number of characters allowed.", + "isOptional": true, + "defaultValue": "Infinity" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minLength", + "value": "number", + "description": "Specifies the min number of characters allowed.", + "isOptional": true, + "defaultValue": "0" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user has finished editing the field, such as when they blur the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user makes changes to the field value. This fires before `onChange`.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", + "isOptional": true + } + ], + "value": "export interface SearchFieldJSXProps\n extends Partial>,\n Pick,\n FieldReactProps,\n FieldSlotInternalReactProps {}" + } + }, + "RequiredSectionProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "RequiredSectionProps", + "value": "Required", + "description": "A version of the section properties with all fields required.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label used to describe the section that will be announced by assistive technologies.\n\nWhen no `heading` property is provided or included as a children of the Section, you **must** provide an `accessibilityLabel` to describe the Section. This is important as it allows assistive technologies to provide the right context to users.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Section.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "heading", + "value": "string", + "description": "A title that describes the content of the section.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "'base' | 'none'", + "description": "Adjust the padding of all edges.\n\n- `base`: applies padding that is appropriate for the element. Note that it may result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the Section need to span to the edge of the Section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", + "isOptional": true, + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "primaryAction", + "value": "ComponentChildren", + "description": "The primary action to perform, provided as a button or link type element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "secondaryActions", + "value": "ComponentChildren", + "description": "The secondary actions to perform, provided as button or link type elements.", + "isOptional": true + } + ] + } + }, + "SectionProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SectionProps", + "description": "The properties for the section component. A section groups related content together with an optional heading, providing semantic structure and visual separation.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "An accessibility label for screen readers that provides additional context when the heading isn't descriptive enough on its own." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "heading", + "value": "string", + "description": "The heading text that appears at the top of the section, helping users understand what content the section contains." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "'base' | 'none'", + "description": "Whether the section has padding around its content. Set to `true` to add padding, or `false` to remove it.", + "defaultValue": "'base'" + } + ], + "value": "export interface SectionProps\n extends Pick<\n RequiredSectionProps,\n 'accessibilityLabel' | 'heading' | 'padding'\n > {\n /**\n * An accessibility label for screen readers that provides additional context when the heading isn't descriptive enough on its own.\n */\n accessibilityLabel: RequiredSectionProps['accessibilityLabel'];\n /**\n * The heading text that appears at the top of the section, helping users understand what content the section contains.\n */\n heading: RequiredSectionProps['heading'];\n /**\n * Whether the section has padding around its content. Set to `true` to add padding, or `false` to remove it.\n */\n padding: RequiredSectionProps['padding'];\n}" + } + }, + "SectionJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SectionJSXProps", + "description": "The properties for the section component when it's used in JSX.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "An accessibility label for screen readers that provides additional context when the heading isn't descriptive enough on its own." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The child elements to render inside the section.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "heading", + "value": "string", + "description": "The heading text that appears at the top of the section, helping users understand what content the section contains." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "'base' | 'none'", + "description": "Whether the section has padding around its content. Set to `true` to add padding, or `false` to remove it.", + "defaultValue": "'base'" + } + ], + "value": "export interface SectionJSXProps\n extends Partial,\n Pick {\n /**\n * The child elements to render inside the section.\n */\n children?: ComponentChildren;\n}" + } + }, + "SelectProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SelectProps", + "description": "Properties for rendering a select dropdown that lets users choose one option from a list with optional icon and label customization.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "icon", + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field to provide visual context for the selection.", + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The value of the currently selected option, matching one of the `value` properties from the available options." + } + ], + "value": "export interface SelectProps\n extends Omit,\n Required<\n Pick<\n SelectProps$1,\n | 'details'\n | 'disabled'\n | 'error'\n | 'label'\n | 'name'\n | 'placeholder'\n | 'required'\n | 'icon'\n | 'labelAccessibilityVisibility'\n >\n > {\n /**\n * The value of the currently selected option, matching one of the `value` properties from the available options.\n */\n value: Required['value'];\n /**\n * An icon that's displayed at the start of the select field to provide visual context for the selection.\n */\n icon: IconProps['type'];\n}" + } + }, + "SelectJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SelectJSXProps", + "description": "Properties for using the select component in JSX with React-style event handlers.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The selectable options displayed in the dropdown list.\n\nAccepts option components for individual selectable items, and option group components to organize related options into logical groups with labels.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "icon", + "value": "\"\" | IconType", + "description": "An icon that's displayed at the start of the select field to provide visual context for the selection." + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onBlur", + "value": "(event: CallbackEvent<\"s-select\">) => void", + "description": "A callback that's triggered when the select loses focus after the user interacts with it.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onChange", + "value": "(event: CallbackEvent<\"s-select\">) => void", + "description": "A callback that's triggered when the selected option changes and the select loses focus.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onFocus", + "value": "(event: CallbackEvent<\"s-select\">) => void", + "description": "A callback that's triggered when the select receives focus from the user.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onInput", + "value": "(event: CallbackEvent<\"s-select\">) => void", + "description": "A callback that's triggered when the selected option changes as the user interacts with the dropdown.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The value of the currently selected option, matching one of the `value` properties from the available options." + } + ], + "value": "export interface SelectJSXProps\n extends Partial>,\n Pick,\n FieldSlotInternalReactProps {\n /**\n * The selectable options displayed in the dropdown list.\n *\n * Accepts option components for individual selectable items, and option group components to organize related options into logical groups with labels.\n */\n children?: ComponentChildren;\n /**\n * A callback that's triggered when the selected option changes and the select loses focus.\n */\n onChange?: (event: CallbackEvent) => void;\n /**\n * A callback that's triggered when the selected option changes as the user interacts with the dropdown.\n */\n onInput?: (event: CallbackEvent) => void;\n /**\n * A callback that's triggered when the select loses focus after the user interacts with it.\n */\n onBlur?: (event: CallbackEvent) => void;\n /**\n * A callback that's triggered when the select receives focus from the user.\n */\n onFocus?: (event: CallbackEvent) => void;\n}" + } + }, + "SpinnerProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SpinnerProps", + "description": "The properties you can set on a spinner component.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose of the progress. When set, it will be announced to users using assistive technologies and will provide them with more context. Providing an `accessibilityLabel` is recommended if there is no accompanying text describing that something is loading.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "size", + "value": "'base' | 'large' | 'large-100'", + "description": "The size of the spinner. Use `base` for the standard size, `large` for a larger spinner, or `large-100` for a full-width large spinner.", + "defaultValue": "'base'" + } + ], + "value": "export interface SpinnerProps\n extends Required> {\n /**\n * The size of the spinner. Use `base` for the standard size, `large` for a larger spinner, or `large-100` for a full-width large spinner.\n */\n size: Extract;\n}" + } + }, + "SpinnerJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SpinnerJSXProps", + "description": "The JSX properties you can set on a spinner component.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose of the progress. When set, it will be announced to users using assistive technologies and will provide them with more context. Providing an `accessibilityLabel` is recommended if there is no accompanying text describing that something is loading.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "size", + "value": "'base' | 'large' | 'large-100'", + "description": "The size of the spinner. Use `base` for the standard size, `large` for a larger spinner, or `large-100` for a full-width large spinner.", + "defaultValue": "'base'" + } + ], + "value": "export interface SpinnerJSXProps\n extends Partial,\n Pick {}" + } + }, + "AlignedStackProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "AlignedStackProps", + "value": "Required", + "description": "A version of the stack properties with all fields required.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "alignContent", + "value": "MaybeResponsive", + "description": "Aligns the Stack along the cross axis.", + "isOptional": true, + "defaultValue": "'normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "alignItems", + "value": "MaybeResponsive", + "description": "Aligns the Stack's children along the cross axis.", + "isOptional": true, + "defaultValue": "'normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "background", + "value": "BackgroundColorKeyword", + "description": "Adjust the background of the element.", + "isOptional": true, + "defaultValue": "'transparent'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "MaybeResponsive", + "description": "Adjust the block size.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "ColorKeyword | ''", + "description": "Set the color of the border.\n\nIf set, it takes precedence over the `border` property's color.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Set the radius of the border.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `start-start start-end end-end end-start`\n- 3 values: `start-start (start-end & end-start) start-end`\n- 2 values: `(start-start & end-end) (start-end & end-start)`\n\nFor example:\n- `small-100` means start-start, start-end, end-end and end-start border radii are `small-100`.\n- `small-100 none` means start-start and end-end border radii are `small-100`, start-end and end-start border radii are `none`.\n- `small-100 none large-100` means start-start border radius is `small-100`, start-end border radius is `none`, end-end border radius is `large-100` and end-start border radius is `none`.\n- `small-100 none large-100 small-100` means start-start border radius is `small-100`, start-end border radius is `none`, end-end border radius is `large-100` and end-start border radius is `small-100`.", + "isOptional": true, + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "MaybeAllValuesShorthandProperty | ''", + "description": "Set the style of the border.\n\nIf set, it takes precedence over the `border` property's style.\n\nLike CSS, up to 4 values can be specified.\n\nIf one value is specified, it applies to all sides.\n\nIf two values are specified, they apply to the block sides and inline sides respectively.\n\nIf three values are specified, they apply to the block-start, both inline sides, and block-end respectively.\n\nIf four values are specified, they apply to the block-start, block-end, inline-start, and inline-end sides respectively.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "MaybeAllValuesShorthandProperty | ''", + "description": "Set the width of the border.\n\nIf set, it takes precedence over the `border` property's width.\n\nLike CSS, up to 4 values can be specified.\n\nIf one value is specified, it applies to all sides.\n\nIf two values are specified, they apply to the block sides and inline sides respectively.\n\nIf three values are specified, they apply to the block-start, both inline sides, and block-end respectively.\n\nIf four values are specified, they apply to the block-start, block-end, inline-start, and inline-end sides respectively.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The content of the Stack.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "columnGap", + "value": "MaybeResponsive", + "description": "Adjust spacing between elements in the inline axis.\n\nThis overrides the column value of `gap`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "direction", + "value": "MaybeResponsive<'block' | 'inline'>", + "description": "Sets how the children are placed within the Stack. This uses [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).", + "isOptional": true, + "defaultValue": "'block'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "display", + "value": "MaybeResponsive<'auto' | 'none'>", + "description": "Sets the outer display type of the component. The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gap", + "value": "MaybeResponsive>", + "description": "Adjust spacing between elements.\n\nA single value applies to both axes. A pair of values (eg `large-100 large-500`) can be used to set the inline and block axes respectively.", + "isOptional": true, + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "MaybeResponsive", + "description": "Adjust the inline size.", + "isOptional": true, + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "justifyContent", + "value": "MaybeResponsive", + "description": "Aligns the Stack along the main axis.", + "isOptional": true, + "defaultValue": "'normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "MaybeResponsive", + "description": "Adjust the maximum block size.", + "isOptional": true, + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "MaybeResponsive", + "description": "Adjust the maximum inline size.", + "isOptional": true, + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "MaybeResponsive", + "description": "Adjust the minimum block size.", + "isOptional": true, + "defaultValue": "'0'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "MaybeResponsive", + "description": "Adjust the minimum inline size.", + "isOptional": true, + "defaultValue": "'0'" + }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@shadowDomRerenderObserver@7237", - "value": "MutationObserver", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@onEscape@7231", - "value": "(event: KeyboardEvent) => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "MaybeResponsive>", + "description": "Adjust the padding of all edges.\n\n[1-to-4-value syntax](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:\n\n- 4 values: `block-start inline-end block-end inline-start`\n- 3 values: `block-start inline block-end`\n- 2 values: `block inline`\n\nFor example:\n- `large` means block-start, inline-end, block-end and inline-start paddings are `large`.\n- `large none` means block-start and block-end paddings are `large`, inline-start and inline-end paddings are `none`.\n- `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`.\n- `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`.\n\nA padding value of `auto` will use the default padding for the closest container that has had its usual padding removed.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@onBackdropClick@7233", - "value": "(event: MouseEvent) => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "paddingBlock", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the block-padding.\n\n- `large none` means block-start padding is `large`, block-end padding is `none`.\n\nThis overrides the block value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@onChildModalChange@7235", - "value": "EventListenerOrEventListenerObject", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "paddingBlockEnd", + "value": "MaybeResponsive", + "description": "Adjust the block-end padding.\n\nThis overrides the block-end value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "__@isOpen@7227", - "value": "boolean", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "paddingBlockStart", + "value": "MaybeResponsive", + "description": "Adjust the block-start padding.\n\nThis overrides the block-start value of `paddingBlock`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "__@dismiss@7229", - "value": "() => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "paddingInline", + "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", + "description": "Adjust the inline padding.\n\n- `large none` means inline-start padding is `large`, inline-end padding is `none`.\n\nThis overrides the inline value of `padding`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "GetAccessor", - "name": "__@hasOpenChildModal@7224", - "value": "boolean", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "paddingInlineEnd", + "value": "MaybeResponsive", + "description": "Adjust the inline-end padding.\n\nThis overrides the inline-end value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "__@show@7225", - "value": "() => Promise", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "paddingInlineStart", + "value": "MaybeResponsive", + "description": "Adjust the inline-start padding.\n\nThis overrides the inline-start value of `paddingInline`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "__@hide@7226", - "value": "() => Promise", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "rowGap", + "value": "MaybeResponsive", + "description": "Adjust spacing between elements in the block axis.\n\nThis overrides the row value of `gap`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + } + ] + } + }, + "ResponsiveStackProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "ResponsiveStackProps", + "value": "MakeResponsivePick<\n AlignedStackProps,\n 'gap' | 'rowGap' | 'columnGap' | 'direction'\n>", + "description": "The stack properties that support responsive values through container queries.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "columnGap", + "value": "MaybeResponsive", + "description": "Adjust spacing between elements in the inline axis.\n\nThis overrides the column value of `gap`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@7174", - "value": "boolean", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "direction", + "value": "MaybeResponsive<'block' | 'inline'>", + "description": "Sets how the children are placed within the Stack. This uses [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values).", + "isOptional": true, + "defaultValue": "'block'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@7175", - "value": "HTMLElement", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "gap", + "value": "MaybeResponsive>", + "description": "Adjust spacing between elements.\n\nA single value applies to both axes. A pair of values (eg `large-100 large-500`) can be used to set the inline and block axes respectively.", + "isOptional": true, + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@7176", - "value": "number", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "rowGap", + "value": "MaybeResponsive", + "description": "Adjust spacing between elements in the block axis.\n\nThis overrides the row value of `gap`.", + "isOptional": true, + "defaultValue": "'' - meaning no override" + } + ] + } + }, + "StackProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "StackProps", + "description": "The properties for the stack component. A stack arranges its children in a single direction with controlled spacing and alignment along both axes.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "alignContent", + "value": "AlignContentKeyword", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "defaultValue": "'normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "alignItems", + "value": "AlignItemsKeyword", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "defaultValue": "'normal'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "background", + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", + "defaultValue": "'transparent'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "blockSize", + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", + "isOptional": true, + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderColor", + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", + "defaultValue": "'none'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "columnGap", + "value": "MaybeResponsive<\"\" | SpacingKeyword>", + "description": "The spacing between children in the inline axis (horizontal in left-to-right languages). This property overrides the column spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'' - meaning no override" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "direction", + "value": "MaybeResponsive<\"inline\" | \"block\">", + "description": "The direction in which the stack's children are laid out. Use `'inline'` to arrange children horizontally (with wrapping enabled), or `'block'` to arrange them vertically (without wrapping). This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'block'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "display", + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "gap", + "value": "MaybeResponsive>", + "description": "The spacing between children in the stack. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value to apply the same spacing to both axes (for example, `'large-100'`), or a pair of values (for example, `'large-100 large-500'`) to set different spacing for the block and inline axes. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "justifyContent", + "value": "JustifyContentKeyword", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "defaultValue": "'normal'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - } - ], - "value": "declare class Modal extends PreactOverlayElement implements ModalProps {\n accessor accessibilityLabel: ModalProps['accessibilityLabel'];\n accessor heading: ModalProps['heading'];\n accessor padding: ModalProps['padding'];\n accessor size: ModalProps['size'];\n /** @private */\n [abortController]: AbortController;\n /** @private */\n [dialog]: HTMLDialogElement | null;\n /** @private */\n [focusedElement]: HTMLElement | null;\n /** @private */\n [nestedModals]: Map;\n /** @private */\n [childrenRerenderObserver]: MutationObserver;\n /** @private */\n [shadowDomRerenderObserver]: MutationObserver;\n /** @private */\n [onEscape]: (event: KeyboardEvent) => void;\n /** @private */\n [onBackdropClick]: (event: MouseEvent) => void;\n /** @private */\n [onChildModalChange]: EventListenerOrEventListenerObject;\n /** @private */\n get [isOpen](): boolean;\n /** @private */\n [dismiss](): void;\n /** @private */\n get [hasOpenChildModal](): boolean;\n /** @private */\n [show](): Promise;\n /** @private */\n [hide](): Promise;\n showOverlay(): void;\n hideOverlay(): void;\n toggleOverlay(): void;\n /** @private */\n connectedCallback(): void;\n /** @private */\n disconnectedCallback(): void;\n constructor();\n}" - } - }, - "RequiredMoneyFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RequiredMoneyFieldProps", - "value": "Required", - "description": "Represents the money field component props with all properties marked as required.", - "isPublicDocs": true, - "members": [ + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", + "defaultValue": "'none'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "autocomplete", - "value": "| AutocompleteField\n | `${AutocompleteSection} ${AutocompleteField}`\n | `${AutocompleteGroup} ${AutocompleteField}`\n | `${AutocompleteSection} ${AutocompleteGroup} ${AutocompleteField}`\n | 'on'\n | 'off'", - "description": "A hint about the intended content of the field for browser autofill.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.\n\nLearn more about the set of [autocomplete values](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill-detail-tokens) supported in browsers.", - "isOptional": true, - "defaultValue": "'on' for everything else" + "name": "minBlockSize", + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "controls", - "value": "'auto' | 'stepper' | 'none'", - "description": "The type of controls displayed in the field.\n\n- `stepper`: displays buttons to increase or decrease the value of the field by the stepping interval defined in the `step` property. Appropriate mouse and [keyboard interactions](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/spinbutton_role#keyboard_interactions) to control the value of the field are enabled.\n- `none`: no controls are displayed and users must input the value manually. Arrow keys and scroll wheels can’t be used either to avoid accidental changes.\n- `auto`: the presence of the controls depends on the surface and context.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "minInlineSize", + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "defaultValue", - "value": "string", - "description": "The initial value of the field when it first loads. Unlike `placeholder`, this is a real value that the user can edit and that gets submitted with the form. Once the user starts typing, their input replaces it. Changing this property after the field has loaded has no effect. To update the field value at any time, use `value` instead.", - "isOptional": true + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "details", - "value": "string", - "description": "Supplementary text displayed below the checkbox to provide additional context, instructions, or help. Use this to explain what checking the box means or provide guidance to users. This text is announced to screen readers.", - "isOptional": true + "name": "padding", + "value": "MaybeResponsive>", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "disabled", - "value": "boolean", - "description": "Whether the field is disabled, preventing any user interaction.", - "isOptional": true, - "defaultValue": "false" + "name": "paddingBlock", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", - "value": "string", - "description": "An error message displayed below the checkbox to indicate validation problems. When set, the checkbox is styled with error indicators and the message is announced to screen readers.", - "isOptional": true + "name": "paddingBlockEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", - "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", - "isOptional": true + "name": "paddingBlockStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "label", - "value": "string", - "description": "The text displayed as the field label, which identifies the purpose of the field to users. This label is associated with the field for accessibility and helps users understand what information to provide.", - "isOptional": true + "name": "paddingInline", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "labelAccessibilityVisibility", - "value": "'visible' | 'exclusive'", - "description": "Controls whether the label is visible to all users or only to screen readers.\n\n- `visible`: The label is shown to everyone (default).\n- `exclusive`: The label is visually hidden but still announced by screen readers.\n\nUse `exclusive` when the surrounding context makes the label redundant visually, but screen reader users still need it for clarity.", - "isOptional": true, - "defaultValue": "'visible'" + "name": "paddingInlineEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "max", - "value": "number", - "description": "The highest decimal or integer value accepted for the field. When used with `step`, the value rounds down to the maximum number.\n\nUsers can still type values higher than the maximum using the keyboard. Implement validation to enforce this constraint.", - "isOptional": true, - "defaultValue": "Infinity" + "name": "paddingInlineStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "min", - "value": "number", - "description": "The lowest decimal or integer value accepted for the field. When used with `step`, the value rounds up to the minimum number.\n\nUsers can still type values lower than the minimum using the keyboard. Implement validation to enforce this constraint.", - "isOptional": true, - "defaultValue": "-Infinity" - }, + "name": "rowGap", + "value": "MaybeResponsive<\"\" | SpacingKeyword>", + "description": "The spacing between children in the block axis (vertical in horizontal writing modes). This property overrides the row spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'' - meaning no override" + } + ], + "value": "export interface StackProps\n extends BoxProps,\n Pick<\n Required,\n 'justifyContent' | 'alignItems' | 'alignContent'\n > {\n /**\n * Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n *\n * Use this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.\n *\n * @default 'normal'\n */\n justifyContent: JustifyContentKeyword;\n /**\n * Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n *\n * Use this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.\n *\n * @default 'normal'\n */\n alignItems: AlignItemsKeyword;\n /**\n * Controls the distribution of lines along the block axis when content wraps into multiple lines.\n *\n * This property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.\n *\n * @default 'normal'\n */\n alignContent: AlignContentKeyword;\n /**\n * The spacing between children in the stack. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value to apply the same spacing to both axes (for example, `'large-100'`), or a pair of values (for example, `'large-100 large-500'`) to set different spacing for the block and inline axes. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default 'none'\n */\n gap: ResponsiveStackProps['gap'];\n /**\n * The spacing between children in the block axis (vertical in horizontal writing modes). This property overrides the row spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default '' - meaning no override\n */\n rowGap: ResponsiveStackProps['rowGap'];\n /**\n * The spacing between children in the inline axis (horizontal in left-to-right languages). This property overrides the column spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default '' - meaning no override\n */\n columnGap: ResponsiveStackProps['columnGap'];\n /**\n * The direction in which the stack's children are laid out. Use `'inline'` to arrange children horizontally (with wrapping enabled), or `'block'` to arrange them vertically (without wrapping). This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.\n *\n * @default 'block'\n *\n * @implementation The content will wrap if the direction is `'inline'`, and won't wrap if the direction is `'block'`.\n */\n direction: ResponsiveStackProps['direction'];\n}" + } + }, + "StackJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "StackJSXProps", + "description": "The properties for the stack component when it's used in JSX.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "name", + "name": "accessibilityLabel", "value": "string", - "description": "The name attribute for the field, used to identify the field's value when the form is submitted. Must be unique within the nearest containing form.", + "description": "A label that describes the purpose or contents of the element. When set, it will be announced to users using assistive technologies and will provide them with more context.\n\nOnly use this when the element's content is not enough context for users using assistive technologies.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onBlur", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).", - "isOptional": true + "name": "accessibilityRole", + "value": "AccessibilityRole", + "description": "Sets the semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "isOptional": true, + "defaultValue": "'generic'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onChange", - "value": "(event: Event) => void", - "description": "A callback fired when the user has finished editing the field, such as when they blur the field or press Enter. Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).", - "isOptional": true + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onFocus", - "value": "(event: FocusEvent) => void", - "description": "A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).", - "isOptional": true + "name": "alignContent", + "value": "AlignContentKeyword", + "description": "Controls the distribution of lines along the block axis when content wraps into multiple lines.\n\nThis property only affects stacks with wrapping content. For single-line stacks, use `alignItems` instead.", + "defaultValue": "'normal'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "onInput", - "value": "(event: Event) => void", - "description": "A callback fired when the user makes any changes in the field, such as typing a character. Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).", - "isOptional": true + "name": "alignItems", + "value": "AlignItemsKeyword", + "description": "Controls the alignment of children along the block axis (vertically in horizontal writing modes).\n\nUse this to align items perpendicular to the stack direction - vertically for inline stacks or horizontally for block stacks.", + "defaultValue": "'normal'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "placeholder", - "value": "string", - "description": "The placeholder text displayed in the field when it's empty, providing a hint about the expected input format or value.", - "isOptional": true + "name": "background", + "value": "'base' | 'transparent' | 'subdued' | 'strong'", + "description": "The background color of the box. You can choose from `'transparent'`, `'base'`, `'subdued'`, or `'strong'` to control the visual emphasis of the background.", + "defaultValue": "'transparent'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "readOnly", - "value": "boolean", - "description": "Whether the field is read-only and can't be edited. Read-only fields remain focusable and their content is announced by screen readers.", - "isOptional": true, - "defaultValue": "false" + "name": "blockSize", + "value": "SizeUnitsOrAuto", + "description": "The vertical size of the box in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about [block-size](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "required", - "value": "boolean", - "description": "Whether the field requires a value before form submission. Displays a visual indicator and adds semantic meaning, but doesn't automatically validate or show errors. Use the `error` property to display validation messages.", + "name": "border", + "value": "BorderShorthand", + "description": "Set the border via the shorthand property.\n\nThis can be a size, optionally followed by a color, optionally followed by a style.\n\nIf the color is not specified, it will be `base`.\n\nIf the style is not specified, it will be `auto`.\n\nValues can be overridden by `borderWidth`, `borderStyle`, and `borderColor`.", "isOptional": true, - "defaultValue": "false" + "defaultValue": "'none' - equivalent to `none base auto`.", + "examples": [ + { + "title": "Example", + "description": "", + "tabs": [ + { + "code": "// The following are equivalent:\n\n", + "title": "Example" + } + ] + } + ] }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "step", - "value": "number", - "description": "The amount the value can increase or decrease by. This can be an integer or decimal. If a `max` or `min` is specified with `step` when increasing/decreasing the value via the buttons, the final value will always round to the `max` or `min` rather than the closest valid amount.", - "isOptional": true, - "defaultValue": "1" + "name": "borderColor", + "value": "'' | 'base' | 'subdued' | 'strong'", + "description": "Controls the color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "value", - "value": "string", - "description": "", - "isOptional": true - } - ] - } - }, - "PasswordFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "PasswordFieldProps", - "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required<\n Pick<\n PasswordFieldProps$1,\n | 'defaultValue'\n | 'details'\n | 'disabled'\n | 'error'\n | 'labelAccessibilityVisibility'\n | 'minLength'\n | 'maxLength'\n | 'label'\n | 'name'\n | 'placeholder'\n | 'readOnly'\n | 'required'\n | 'value'\n >\n >", - "description": "Represents the props for password input field components. Extends `PreactFieldProps` with autocomplete support for password-related fields.", - "isPublicDocs": true - } - }, - "Popover": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "Popover", - "description": "Configure the following properties on the popover component.", - "isPublicDocs": true, - "members": [ + "name": "borderRadius", + "value": "MaybeAllValuesShorthandProperty", + "description": "Controls the roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different radii per corner. Use this to create rounded corners or fully rounded elements. One value applies to all corners, two values apply to opposite corners, and so on.", + "defaultValue": "'none'" + }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "blockSize", - "value": "SizeUnitsOrAuto", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about the [block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "defaultValue": "'auto'" + "syntaxKind": "PropertySignature", + "name": "borderStyle", + "value": "\"\" | MaybeAllValuesShorthandProperty", + "description": "Controls the visual style of the border on all sides (solid, dashed, auto, or none).\n\nWhen set, this overrides the style value specified in the `border` property. Supports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box)for specifying different styles per side: one value applies to all sides, two values apply to block and inline sides, and so on.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "minBlockSize", - "value": "SizeUnits", - "description": "The minimum vertical size of the element in standard layouts (min-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the block axis.\n\nLearn more about the [min-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", - "defaultValue": "'0'" + "syntaxKind": "PropertySignature", + "name": "borderWidth", + "value": "\"\" | MaybeAllValuesShorthandProperty<\"small\" | \"small-100\" | \"base\" | \"large\" | \"large-100\" | \"none\">", + "description": "Controls the thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "maxBlockSize", - "value": "SizeUnitsOrNone", - "description": "The maximum vertical size of the element in standard layouts (max-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the block axis.\n\nLearn more about the [max-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", - "defaultValue": "'none'" + "syntaxKind": "PropertySignature", + "name": "children", + "value": "ComponentChildren", + "description": "The child elements to render inside the stack.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "inlineSize", - "value": "SizeUnitsOrAuto", - "description": "The horizontal size of the element in standard layouts (width in left-to-right or right-to-left writing modes).\n\nInline size adjusts based on the writing direction: in horizontal layouts, it controls the width; in vertical layouts, it controls the height. This ensures consistent behavior across different text directions.\n\nLearn more about the [inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "defaultValue": "'auto'" + "syntaxKind": "PropertySignature", + "name": "columnGap", + "value": "MaybeResponsive<\"\" | SpacingKeyword>", + "description": "The spacing between children in the inline axis (horizontal in left-to-right languages). This property overrides the column spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "minInlineSize", - "value": "SizeUnits", - "description": "The minimum horizontal size of the element in standard layouts (min-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the inline axis.\n\nLearn more about the [min-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", - "defaultValue": "'0'" + "syntaxKind": "PropertySignature", + "name": "direction", + "value": "MaybeResponsive<\"inline\" | \"block\">", + "description": "The direction in which the stack's children are laid out. Use `'inline'` to arrange children horizontally (with wrapping enabled), or `'block'` to arrange them vertically (without wrapping). This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'block'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "maxInlineSize", - "value": "SizeUnitsOrNone", - "description": "The maximum horizontal size of the element in standard layouts (max-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the inline axis.\n\nLearn more about the [max-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", - "defaultValue": "'none'" + "syntaxKind": "PropertySignature", + "name": "display", + "value": "MaybeResponsive<\"auto\" | \"none\">", + "description": "The outer [display](https://developer.mozilla.org/en-US/docs/Web/CSS/display) type of the component, which controls how it participates in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). Use `'auto'` for the component's default behavior, or `'none'` to hide the component completely and remove it from the accessibility tree.", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHidden@7174", - "value": "boolean", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "gap", + "value": "MaybeResponsive>", + "description": "The spacing between children in the stack. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value to apply the same spacing to both axes (for example, `'large-100'`), or a pair of values (for example, `'large-100 large-500'`) to set different spacing for the block and inline axes. This property also accepts [responsive values](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@overlayActivator@7175", - "value": "HTMLElement", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertyDeclaration", - "name": "__@overlayHideFrameId@7176", - "value": "number", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "inlineSize", + "value": "SizeUnitsOrAuto", + "description": "The [inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size) of the box (width in horizontal writing modes).", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "setAttribute", - "value": "(name: string, value: string) => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "justifyContent", + "value": "JustifyContentKeyword", + "description": "Controls the distribution of children along the inline axis (horizontally in horizontal writing modes).\n\nUse this to position items along the primary axis of the stack - horizontally for inline stacks or vertically for block stacks when wrapped into multiple lines.", + "defaultValue": "'normal'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "attributeChangedCallback", - "value": "(name: string) => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "maxBlockSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size) of the box (maximum height in horizontal writing modes).", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "connectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "maxInlineSize", + "value": "SizeUnitsOrNone", + "description": "The [maximum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size) of the box (maximum width in horizontal writing modes).", + "defaultValue": "'none'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "disconnectedCallback", - "value": "() => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "minBlockSize", + "value": "SizeUnits", + "description": "The [minimum block size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size) of the box (minimum height in horizontal writing modes).", + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "adoptedCallback", - "value": "() => void", - "description": "", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "minInlineSize", + "value": "SizeUnits", + "description": "The [minimum inline size](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size) of the box (minimum width in horizontal writing modes).", + "defaultValue": "'0'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "queueRender", - "value": "() => void", - "description": "A method that queues a run of the render function. You shouldn't need to call this manually - it should be handled by changes to", - "isPrivate": true + "syntaxKind": "PropertySignature", + "name": "overflow", + "value": "'hidden' | 'visible'", + "description": "Sets the overflow behavior of the element.\n\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.\n- `visible`: the content that extends beyond the element’s container is visible.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "MethodDeclaration", - "name": "click", - "value": "({ sourceEvent }?: ClickOptions) => void", - "description": "A method like the standard `element.click()`, but you can influence the behavior with a `sourceEvent`.\n\nFor example, if the `sourceEvent` was a middle click, or has particular keys held down, components will attempt to produce the desired behavior on links, such as opening the page in the background tab.", - "isPrivate": true - } - ], - "value": "declare class Popover\n extends PreactPopoverElement\n implements PopoverProps\n{\n constructor();\n}" - } - }, - "SearchFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "SearchFieldProps", - "value": "PreactFieldProps<\n /**\n * @default 'on'\n */\n Required['autocomplete']\n> & Required<\n Pick<\n TextFieldProps$1,\n | 'defaultValue'\n | 'details'\n | 'disabled'\n | 'error'\n | 'labelAccessibilityVisibility'\n | 'minLength'\n | 'maxLength'\n | 'label'\n | 'name'\n | 'placeholder'\n | 'readOnly'\n | 'required'\n | 'value'\n >\n >", - "description": "Represents the props for search input field components. Extends `PreactFieldProps` for search-specific functionality.", - "isPublicDocs": true - } - }, - "RequiredSectionProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "RequiredSectionProps", - "value": "Required", - "description": "Represents the section component props with all properties marked as required.", - "isPublicDocs": true, - "members": [ + "syntaxKind": "PropertySignature", + "name": "padding", + "value": "MaybeResponsive>", + "description": "The padding on all sides of the box. The [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) is supported, using flow-relative values in the order `block-start inline-end block-end inline-start`. For example, `'large'` applies large padding to all sides, while `'large none'` applies large padding to the block axis and no padding to the inline axis. A value of `'auto'` will use the default padding from the closest container that has had its padding removed. This property also accepts responsive values using container query syntax.", + "defaultValue": "'none'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityLabel", - "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", - "isOptional": true + "name": "paddingBlock", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the block axis (top and bottom in horizontal writing modes). This property overrides the block-axis value set by the `padding` property. For example, `'large none'` applies large padding to the block-start and no padding to the block-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The content displayed within the section component, which groups related elements together in a logical unit with an optional heading.", - "isOptional": true + "name": "paddingBlockEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the block axis (bottom in horizontal writing modes). This property overrides the block-end value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "heading", - "value": "string", - "description": "The heading text displayed at the top of the section. This heading provides a title for the section's content and automatically uses the appropriate semantic heading level (h2, h3, h4) based on nesting depth to maintain proper document structure.", - "isOptional": true + "name": "paddingBlockStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the block axis (top in horizontal writing modes). This property overrides the block-start value set by the `paddingBlock` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "id", - "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", - "isOptional": true + "name": "paddingInline", + "value": "MaybeResponsive<\"\" | MaybeTwoValuesShorthandProperty>", + "description": "The padding on the inline axis (left and right in horizontal writing modes). This property overrides the inline-axis value set by the `padding` property. For example, `'large none'` applies large padding to the inline-start and no padding to the inline-end. This property also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "padding", - "value": "'base' | 'none'", - "description": "The padding applied to all edges of the element.\n\n- `base`: applies padding that is appropriate for the element. Note that it might result in no padding if this is the right design decision in a particular context.\n- `none`: removes all padding from the element. This can be useful when elements inside the section need to span to the edge of the section. For example, a full-width image. In this case, rely on `s-box` with a padding of 'base' to bring back the desired padding for the rest of the content.", - "isOptional": true, - "defaultValue": "'base'" + "name": "paddingInlineEnd", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the end of the inline axis (right in left-to-right writing modes). This property overrides the inline-end value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "primaryAction", - "value": "ComponentChildren", - "description": "The primary action button or link, representing the main or most important action available in this context. Typically displayed with higher visual prominence than secondary actions to establish clear hierarchy.", - "isOptional": true + "name": "paddingInlineStart", + "value": "MaybeResponsive<\"\" | PaddingKeyword>", + "description": "The padding at the start of the inline axis (left in left-to-right writing modes). This property overrides the inline-start value set by the `paddingInline` property. It also accepts responsive values using container query syntax.", + "defaultValue": "'' - meaning no override" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondaryActions", - "value": "ComponentChildren", - "description": "Additional action buttons or links that provide alternative or supporting actions. Visually de-emphasized compared to the primary action.", - "isOptional": true + "name": "rowGap", + "value": "MaybeResponsive<\"\" | SpacingKeyword>", + "description": "The spacing between children in the block axis (vertical in horizontal writing modes). This property overrides the row spacing set by the `gap` property. You can provide a single [`SpacingKeyword`](/docs/api/polaris/using-web-components#scale) value (for example, `'large-100'`), or a [responsive value](/docs/api/polaris/using-web-components#responsive-values) using container query syntax.", + "defaultValue": "'' - meaning no override" } - ] + ], + "value": "export interface StackJSXProps\n extends Partial,\n Pick {\n /**\n * The child elements to render inside the stack.\n */\n children?: ComponentChildren;\n}" } }, - "AlignedStackProps": { + "SwitchProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "AlignedStackProps", - "value": "Required", - "description": "Represents the stack component props with all properties marked as required.", + "name": "SwitchProps", + "description": "Properties for rendering a switch that lets users toggle a setting on or off with a sliding control interface.", "isPublicDocs": true, "members": [ { @@ -19261,391 +25478,361 @@ "syntaxKind": "PropertySignature", "name": "accessibilityLabel", "value": "string", - "description": "A label that describes the purpose or content of the component for assistive technologies like screen readers. Use this to provide additional context when the visible content alone doesn't clearly convey the component's purpose.", + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityRole", - "value": "AccessibilityRole", - "description": "The semantic meaning of the component’s content. When set, the role will be used by assistive technologies to help users navigate the page.", + "name": "checked", + "value": "boolean", + "description": "Whether the control is active.", "isOptional": true, - "defaultValue": "'generic'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessibilityVisibility", - "value": "'visible' | 'hidden' | 'exclusive'", - "description": "The visibility mode of the element for both visual and assistive technology users.\n\n- `visible`: The element is visible to all users (both sighted users and screen readers).\n- `hidden`: The element is visually visible but hidden from screen readers. Use this for decorative elements that don't provide meaningful information.\n- `exclusive`: The element is visually hidden but announced by screen readers. Use this for screen-reader-only content like skip links or additional context.", + "name": "defaultChecked", + "value": "boolean", + "description": "Whether the control is active by default.", "isOptional": true, - "defaultValue": "'visible'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "alignContent", - "value": "MaybeResponsive", - "description": "The alignment of multiple lines of content along the stack component's cross axis.\n\nThis only applies when content wraps to multiple lines (typically in inline direction).\n\nLearn more about the [align-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content).", - "isOptional": true, - "defaultValue": "'normal'" + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "alignItems", - "value": "MaybeResponsive", - "description": "The alignment of individual children along the stack component's cross axis (perpendicular to the stacking direction).\n\nFor example, in a vertical stack (block direction), this controls horizontal alignment of each child.\n\nLearn more about the [align-items property](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items).", + "name": "disabled", + "value": "boolean", + "description": "Disables the control, disallowing any interaction.", "isOptional": true, - "defaultValue": "'normal'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "background", - "value": "BackgroundColorKeyword", - "description": "The background color of the element. Use `transparent` for no background, `subdued` for a subtle background, `base` for standard background, or `strong` for a prominent background.\n\n- `transparent`: No background, allowing the underlying surface to show through.\n- `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment.", - "isOptional": true, - "defaultValue": "'transparent'" + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blockSize", - "value": "MaybeResponsive", - "description": "The vertical size of the element in standard layouts (height in left-to-right or right-to-left writing modes).\n\nBlock size adjusts based on the writing direction: in horizontal layouts, it controls the height; in vertical layouts, it controls the width. This ensures consistent behavior across different text directions.\n\nLearn more about the [block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/block-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "label", + "value": "string | ComponentChildren", + "description": "Visual content to use as the control label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "border", - "value": "BorderShorthand", - "description": "A border applied using shorthand syntax to specify width, color, and style in a single property.\n\nAccepts a size value, optionally followed by a color, optionally followed by a style. Omitted values use defaults: color defaults to `base`, style defaults to `auto`.\n\nIndividual properties (`borderWidth`, `borderStyle`, `borderColor`) can override values set here.", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "'none' - equivalent to `none base auto`.", - "examples": [ - { - "title": "Example", - "description": "", - "tabs": [ - { - "code": "// The following are equivalent:\n\n", - "title": "Example" - } - ] - } - ] + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderColor", - "value": "ColorKeyword | ''", - "description": "The color of the border using the design system's color scale.\n\nWhen set, this overrides the color value specified in the `border` property. Choose from `subdued`, `base`, or `strong` to match the visual emphasis needed.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "name", + "value": "string", + "description": "An identifier for the control that is unique within the nearest containing `Form` component.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderRadius", - "value": "MaybeAllValuesShorthandProperty", - "description": "The roundedness of the element's corners using the design system's radius scale.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- One value: applies to all corners\n- Two values: applies to start corners (top-left & bottom-right) and end corners (top-right & bottom-left) respectively\n- Three values: applies to start-start (top-left), end corners (top-right & bottom-left), and end-end (bottom-right) respectively\n- Four values: applies to start-start (top-left), start-end (top-right), end-end (bottom-right), and end-start (bottom-left) respectively\n\nExamples:\n- `small-100`: All corners have `small-100` radius\n- `small-100 none`: Top-left and bottom-right are `small-100`, top-right and bottom-left are `none`\n- `small-100 none large-100`: Top-left is `small-100`, top-right and bottom-left are `none`, bottom-right is `large-100`\n- `small-100 none large-100 base`: Each corner has its specified radius value", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderStyle", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The visual style of the border on all sides, such as solid, dashed, or dotted.\n\nWhen set, this overrides the style value specified in the `border` property.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different styles per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "value", + "value": "string", + "description": "" + } + ], + "value": "export interface SwitchProps\n extends PreactCheckboxProps,\n Required> {}" + } + }, + "SwitchJSXProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "SwitchJSXProps", + "description": "Properties for using the switch component in JSX with React-style event handlers.", + "isPublicDocs": true, + "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityLabel", + "value": "string", + "description": "A label used for users using assistive technologies like screen readers. When set, any children or `label` supplied will not be announced. This can also be used to display a control without a visual label, while still providing context to users using screen readers.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "borderWidth", - "value": "MaybeAllValuesShorthandProperty | ''", - "description": "The thickness of the border on all sides. When set, this overrides the width value specified in the `border` property.\n\n- `small`: Thin border for subtle definition.\n- `small-100`: Extra thin border for minimal emphasis.\n- `base`: Standard border width.\n- `large`: Thick border for strong emphasis.\n- `large-100`: Extra thick border for maximum prominence.\n- `none`: No border.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) for specifying different widths per side:\n- One value: applies to all sides\n- Two values: applies to block sides (top/bottom) and inline sides (left/right) respectively\n- Three values: applies to block-start (top), inline sides (left/right), and block-end (bottom) respectively\n- Four values: applies to block-start (top), inline-end (right), block-end (bottom), and inline-start (left) respectively", + "name": "checked", + "value": "boolean", + "description": "Whether the control is active.", "isOptional": true, - "defaultValue": "'' - meaning no override" - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "children", - "value": "ComponentChildren", - "description": "The child elements displayed within the stack component, which are arranged vertically or horizontally with consistent spacing.", - "isOptional": true + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "columnGap", - "value": "MaybeResponsive", - "description": "The horizontal spacing between elements (in horizontal writing modes).\n\nSets the gap along the inline axis. This overrides the column value specified in `gap`.", + "name": "defaultChecked", + "value": "boolean", + "description": "Whether the control is active by default.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "direction", - "value": "MaybeResponsive<'block' | 'inline'>", - "description": "The direction in which children are arranged within the stack.\n\n- `block`: Arranges children vertically in a column (in horizontal writing modes). Children will not wrap.\n- `inline`: Arranges children horizontally in a row (in horizontal writing modes). Children will wrap to the next line if needed.\n\nThis uses [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values) to ensure proper behavior across different writing modes.", - "isOptional": true, - "defaultValue": "'block'" + "name": "details", + "value": "string | ComponentChildren", + "description": "Additional text to provide context or guidance for the field. This text is displayed along with the field and its label to offer more information or instructions to the user.\n\nThis will also be exposed to screen reader users.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "display", - "value": "MaybeResponsive<'auto' | 'none'>", - "description": "The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout).\n\n- `auto`: the component’s initial value. The actual value depends on the component and context.\n- `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers.\n\nLearn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display).", + "name": "disabled", + "value": "boolean", + "description": "Disables the control, disallowing any interaction.", "isOptional": true, - "defaultValue": "'auto'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gap", - "value": "MaybeResponsive>", - "description": "The spacing between child elements.\n\nAccepts a single value to apply to both axes, or two space-separated values to set the row and column gaps independently. For example: `large-100 large-500` sets the row gap to `large-100` and column gap to `large-500`.", - "isOptional": true, - "defaultValue": "'none'" + "name": "error", + "value": "string | ComponentChildren", + "description": "Indicate an error to the user. The field will be given a specific stylistic treatment to communicate problems that have to be resolved immediately.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "id", "value": "string", - "description": "A unique identifier for the element. Use this to reference the element in JavaScript, link labels to form controls, or target specific elements for styling or scripting.", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "inlineSize", - "value": "MaybeResponsive", - "description": "The horizontal size of the element in standard layouts (width in left-to-right or right-to-left writing modes).\n\nInline size adjusts based on the writing direction: in horizontal layouts, it controls the width; in vertical layouts, it controls the height. This ensures consistent behavior across different text directions.\n\nLearn more about the [inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/inline-size).\n\n- `SizeUnits`: Specific size values in pixels, percentages, or zero for precise control.\n- `auto`: Automatically sizes based on content and layout constraints.", - "isOptional": true, - "defaultValue": "'auto'" + "name": "label", + "value": "string | ComponentChildren", + "description": "Visual content to use as the control label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "justifyContent", - "value": "MaybeResponsive", - "description": "The distribution of children along the stack component's main axis (the direction of stacking).\n\nFor example, in a vertical stack (block direction), this controls vertical distribution. Use this to space out children or align them to the start, center, or end.\n\nLearn more about the [justify-content property](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).", + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", "isOptional": true, - "defaultValue": "'normal'" + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxBlockSize", - "value": "MaybeResponsive", - "description": "The maximum vertical size of the element in standard layouts (max-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the block axis.\n\nLearn more about the [max-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-block-size).", - "isOptional": true, - "defaultValue": "'none'" + "name": "name", + "value": "string", + "description": "An identifier for the control that is unique within the nearest containing `Form` component.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "maxInlineSize", - "value": "MaybeResponsive", - "description": "The maximum horizontal size of the element in standard layouts (max-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming larger than this size along the inline axis.\n\nLearn more about the [max-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/max-inline-size).", - "isOptional": true, - "defaultValue": "'none'" + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minBlockSize", - "value": "MaybeResponsive", - "description": "The minimum vertical size of the element in standard layouts (min-height in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the block axis.\n\nLearn more about the [min-block-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-block-size).", - "isOptional": true, - "defaultValue": "'0'" + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the switch's checked state changes and it loses focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "minInlineSize", - "value": "MaybeResponsive", - "description": "The minimum horizontal size of the element in standard layouts (min-width in left-to-right or right-to-left writing modes).\n\nPrevents the element from becoming smaller than this size along the inline axis.\n\nLearn more about the [min-inline-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/min-inline-size).", - "isOptional": true, - "defaultValue": "'0'" + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's triggered when the switch's checked state changes as the user interacts with it.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "overflow", - "value": "'hidden' | 'visible'", - "description": "The overflow behavior of the element.\n\n- `visible`: the content that extends beyond the element’s container is visible.\n- `hidden`: clips the content when it is larger than the element’s container. The element will not be scrollable and the users will not be able to access the clipped content by dragging or using a scroll wheel on a mouse.", + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", "isOptional": true, - "defaultValue": "'visible'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "padding", - "value": "MaybeResponsive>", - "description": "The padding applied to all edges of the component.\n\nSupports [1-to-4-value syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties#edges_of_a_box) using flow-relative values:\n- 1 value applies to all sides\n- 2 values apply to block (top/bottom) and inline (left/right)\n- 3 values apply to block-start (top), inline (left/right), and block-end (bottom)\n- 4 values apply to block-start (top), inline-end (right), block-end (bottom), and inline-start (left)\n\n**Examples:** `base`, `large none`, `base large-100 base small`\n\nUse `auto` to inherit padding from the nearest container with removed padding.", - "isOptional": true, - "defaultValue": "'none'" - }, + "name": "value", + "value": "string", + "description": "" + } + ], + "value": "export interface SwitchJSXProps\n extends Partial,\n Pick {\n /**\n * A callback that's triggered when the switch's checked state changes and it loses focus.\n */\n onChange?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's triggered when the switch's checked state changes as the user interacts with it.\n */\n onInput?: ((event: CallbackEvent) => void) | null;\n onBlur?: ((event: CallbackEvent) => void) | null;\n}" + } + }, + "TableProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "TableProps", + "description": "The properties you can set on a table component.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlock", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The block-direction padding (top and bottom in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for block-start and block-end.\n\n**Example:** `large none` applies `large` to the top and `none` to the bottom.\n\nOverrides the block value from `padding`.", + "name": "hasNextPage", + "value": "boolean", + "description": "Whether there's an additional page of data.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockEnd", - "value": "MaybeResponsive", - "description": "The block-end padding (bottom in horizontal writing modes).\n\nOverrides the block-end value from `paddingBlock`.", + "name": "hasPreviousPage", + "value": "boolean", + "description": "Whether there's a previous page of data.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingBlockStart", - "value": "MaybeResponsive", - "description": "The block-start padding (top in horizontal writing modes).\n\nOverrides the block-start value from `paddingBlock`.", + "name": "loading", + "value": "boolean", + "description": "Whether the table is in a loading state, such as initial page load or loading the next page in a paginated table. When true, the table could be in an inert state, which prevents user interaction.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInline", - "value": "MaybeResponsive<\n MaybeTwoValuesShorthandProperty | ''\n >", - "description": "The inline-direction padding (left and right in horizontal writing modes).\n\nAccepts a single value for both sides or two space-separated values for inline-start and inline-end.\n\n**Example:** `large none` applies `large` to the left and `none` to the right.\n\nOverrides the inline value from `padding`.", + "name": "paginate", + "value": "boolean", + "description": "Whether to use pagination controls.", "isOptional": true, - "defaultValue": "'' - meaning no override" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineEnd", - "value": "MaybeResponsive", - "description": "The inline-end padding (right in LTR writing modes, left in RTL).\n\nOverrides the inline-end value from `paddingInline`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" - }, + "name": "variant", + "value": "'auto' | 'list'", + "description": "The display variant of the table. Use `list` to force a list view, or `auto` to automatically switch between table and list based on the available space.", + "defaultValue": "'auto'" + } + ], + "value": "export interface TableProps\n extends Required<\n Pick<\n TableProps$1,\n 'loading' | 'paginate' | 'hasPreviousPage' | 'hasNextPage' | 'variant'\n >\n > {\n /**\n * The display variant of the table. Use `list` to force a list view, or `auto` to automatically switch between table and list based on the available space.\n */\n variant: Extract;\n}" + } + }, + "TableHeaderProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "TableHeaderProps", + "description": "The properties you can set on a table header component.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "paddingInlineStart", - "value": "MaybeResponsive", - "description": "The inline-start padding (left in LTR writing modes, right in RTL).\n\nOverrides the inline-start value from `paddingInline`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "format", + "value": "HeaderFormat", + "description": "The format of the header, which affects how the cell content is aligned and displayed. Use `base` for standard text, `currency` for monetary values, or `numeric` for numbers.", + "defaultValue": "'base'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "rowGap", - "value": "MaybeResponsive", - "description": "The vertical spacing between elements (in horizontal writing modes).\n\nSets the gap along the block axis. This overrides the row value specified in `gap`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "listSlot", + "value": "'primary' | 'secondary' | 'inline' | 'kicker' | 'labeled'", + "description": "The slot where this header's data appears in list view. The options include `primary` for the main content, `secondary` for supporting text, `labeled` for labeled data, `kicker` for small text above the primary content, or `inline` for inline content.", + "defaultValue": "'labeled'" } - ] + ], + "value": "export interface TableHeaderProps\n extends Pick {\n /**\n * The slot where this header's data appears in list view. The options include `primary` for the main content, `secondary` for supporting text, `labeled` for labeled data, `kicker` for small text above the primary content, or `inline` for inline content.\n */\n listSlot: Extract<\n TableHeaderProps$1['listSlot'],\n 'primary' | 'secondary' | 'labeled' | 'kicker' | 'inline'\n >;\n /**\n * The format of the header, which affects how the cell content is aligned and displayed. Use `base` for standard text, `currency` for monetary values, or `numeric` for numbers.\n */\n format: HeaderFormat;\n}" } }, - "ResponsiveStackProps": { + "TableJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "ResponsiveStackProps", - "value": "MakeResponsivePick<\n AlignedStackProps,\n 'gap' | 'rowGap' | 'columnGap' | 'direction'\n>", - "description": "Represents stack props with responsive capabilities for layout properties.\n\nThis enables conditional styling based on container queries.", + "name": "TableJSXProps", + "description": "The JSX properties you can set on a table component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "columnGap", - "value": "MaybeResponsive", - "description": "The horizontal spacing between elements (in horizontal writing modes).\n\nSets the gap along the inline axis. This overrides the column value specified in `gap`.", - "isOptional": true, - "defaultValue": "'' - meaning no override" + "name": "children", + "value": "ComponentChildren", + "description": "The content to display inside the table, which should include table header row, table body, and table row components.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "direction", - "value": "MaybeResponsive<'block' | 'inline'>", - "description": "The direction in which children are arranged within the stack.\n\n- `block`: Arranges children vertically in a column (in horizontal writing modes). Children will not wrap.\n- `inline`: Arranges children horizontally in a row (in horizontal writing modes). Children will wrap to the next line if needed.\n\nThis uses [logical properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values) to ensure proper behavior across different writing modes.", - "isOptional": true, - "defaultValue": "'block'" + "name": "filters", + "value": "ComponentChildren", + "description": "Additional filters to display in the table. For example, you can use the search field component to filter the table data.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "gap", - "value": "MaybeResponsive>", - "description": "The spacing between child elements.\n\nAccepts a single value to apply to both axes, or two space-separated values to set the row and column gaps independently. For example: `large-100 large-500` sets the row gap to `large-100` and column gap to `large-500`.", + "name": "hasNextPage", + "value": "boolean", + "description": "Whether there's an additional page of data.", "isOptional": true, - "defaultValue": "'none'" + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "rowGap", - "value": "MaybeResponsive", - "description": "The vertical spacing between elements (in horizontal writing modes).\n\nSets the gap along the block axis. This overrides the row value specified in `gap`.", + "name": "hasPreviousPage", + "value": "boolean", + "description": "Whether there's a previous page of data.", "isOptional": true, - "defaultValue": "'' - meaning no override" - } - ] - } - }, - "TextAreaProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "TextAreaProps", - "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required>", - "description": "Represents the props for textarea components. Extends `PreactFieldProps` for multi-line text input functionality.", - "isPublicDocs": true - } - }, - "URLFieldProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "URLFieldProps", - "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required>", - "description": "Represents the props for URL input field components. Extends `PreactFieldProps` with autocomplete support for URL-related fields.", - "isPublicDocs": true - } - }, - "AdminActionProps": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AdminActionProps", - "description": "Configure the following properties on the admin action component.", - "isPublicDocs": true, - "members": [ + "defaultValue": "false" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "heading", + "name": "id", "value": "string", - "description": "The text to use as the action modal's title. If not provided, the name of the extension will be used.", + "description": "A unique identifier for the element.", "isOptional": true }, { @@ -19653,1914 +25840,1948 @@ "syntaxKind": "PropertySignature", "name": "loading", "value": "boolean", - "description": "Whether the action is in a loading state, such as during initial page load or when the action is being opened. When `true`, the action is in an inert state that prevents user interaction.", + "description": "Whether the table is in a loading state, such as initial page load or loading the next page in a paginated table. When true, the table could be in an inert state, which prevents user interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onNextPage", + "value": "(event: Event) => void", + "description": "Called when the next page button is clicked.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onPreviousPage", + "value": "(event: Event) => void", + "description": "Called when the previous page button is clicked.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "paginate", + "value": "boolean", + "description": "Whether to use pagination controls.", "isOptional": true, "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "variant", + "value": "'auto' | 'list'", + "description": "The display variant of the table. Use `list` to force a list view, or `auto` to automatically switch between table and list based on the available space.", + "defaultValue": "'auto'" } ], - "value": "export interface AdminActionProps\n extends Pick {}" + "value": "export interface TableJSXProps\n extends Partial,\n Pick {\n /**\n * The content to display inside the table, which should include table header row, table body, and table row components.\n */\n children?: ComponentChildren;\n /**\n * Additional filters to display in the table. For example, you can use the search field component to filter the table data.\n */\n filters?: ComponentChildren;\n}" } }, - "AdminBlockProps": { + "TableBodyProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "AdminBlockProps", - "description": "Configure the following properties on the admin block component.", + "name": "TableBodyProps", + "description": "The properties you can set on a table body component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "collapsedSummary", - "value": "string", - "description": "The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated.", + "name": "children", + "value": "ComponentChildren", + "description": "The body of the table. May not have any semantic meaning in the Table's `list` variant.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "heading", + "name": "id", "value": "string", - "description": "The text displayed as the block's title in the header. If not provided, the extension name will be used.", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface AdminBlockProps\n extends Pick {}" + "value": "export interface TableBodyProps extends TableBodyProps$1 {}" } }, - "AdminPrintActionProps": { + "TableBodyJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "AdminPrintActionProps", - "description": "Configure the following properties on the admin print action component.", + "name": "TableBodyJSXProps", + "description": "The JSX properties you can set on a table body component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "src", + "name": "children", + "value": "ComponentChildren", + "description": "The body content of the table, which should include table row components. This content might not have any semantic meaning when the table uses the `list` variant.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", "value": "string", - "description": "The URL of the document to preview and print. Supports HTML, PDF, and image formats. If not provided, the preview will show an empty state and the print button will be disabled.", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface AdminPrintActionProps\n extends Pick {}" - } - }, - "FunctionSettingsErrorEvent": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "TypeAliasDeclaration", - "name": "FunctionSettingsErrorEvent", - "value": "AggregateErrorEvent", - "description": "Represents the event type for function settings errors. Extracted from the parameters of the `onFunctionSettingsError` callback.", - "isPublicDocs": true + "value": "export interface TableBodyJSXProps\n extends Partial,\n Pick {\n /**\n * The body content of the table, which should include table row components. This content might not have any semantic meaning when the table uses the `list` variant.\n */\n children?: ComponentChildren;\n}" } }, - "AvatarEvents": { + "TableCellProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "AvatarEvents", - "description": "The avatar component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "TableCellProps", + "description": "The properties you can set on a table cell component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", - "value": "OnErrorEventHandler", - "description": "A callback fired when the avatar image fails to load.\n\nLearn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event)." + "name": "children", + "value": "ComponentChildren", + "description": "The content of the table cell.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "load", - "value": "CallbackEventListener | null", - "description": "A callback fired when the avatar image successfully loads.\n\nLearn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event)." + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true } ], - "value": "export interface AvatarEvents {\n /**\n * A callback fired when the avatar image successfully loads.\n *\n * Learn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback fired when the avatar image fails to load.\n *\n * Learn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).\n */\n error: OnErrorEventHandler = null;\n}" + "value": "export interface TableCellProps extends TableCellProps$1 {}" } }, - "BadgeSlots": { + "TableCellJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BadgeSlots", - "description": "The badge component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "TableCellJSXProps", + "description": "The JSX properties you can set on a table cell component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", - "value": "HTMLElement", - "description": "The text label displayed within the badge component, typically a short status indicator or category label.", + "value": "ComponentChildren", + "description": "The content to display inside the table cell.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface BadgeSlots {\n /**\n * The text label displayed within the badge component, typically a short status indicator or category label.\n */\n children?: HTMLElement;\n}" + "value": "export interface TableCellJSXProps\n extends Partial,\n Pick {\n /**\n * The content to display inside the table cell.\n */\n children?: ComponentChildren;\n}" } }, - "BannerEvents": { + "TableHeaderJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BannerEvents", - "description": "The banner component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "TableHeaderJSXProps", + "description": "The JSX properties you can set on a table header component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "afterhide", - "value": "CallbackEventListener | null", - "description": "A callback fired after the banner is hidden." + "name": "children", + "value": "ComponentChildren", + "description": "The heading of the column when the table uses the `table` variant, and the label of its data when the table uses the `list` variant.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "dismiss", - "value": "CallbackEventListener | null", - "description": "A callback fired when the banner is dismissed." - } - ], - "value": "export interface BannerEvents {\n /**\n * A callback fired when the banner is dismissed.\n */\n dismiss: CallbackEventListener | null = null;\n /**\n * A callback fired after the banner is hidden.\n */\n afterhide: CallbackEventListener | null = null;\n}" - } - }, - "BannerSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "BannerSlots", - "description": "The banner component supports slots for additional content placement within the banner. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "format", + "value": "HeaderFormat", + "description": "The format of the header, which affects how the cell content is aligned and displayed. Use `base` for standard text, `currency` for monetary values, or `numeric` for numbers." + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The main message content displayed within the banner component, providing important information or guidance to users.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondary-actions", - "value": "HTMLElement", - "description": "Action buttons displayed at the bottom of the banner that let users respond to the message. Accepts up to two button components with `variant=\"secondary\"` or `variant=\"auto\"`.", - "isOptional": true + "name": "listSlot", + "value": "'primary' | 'secondary' | 'inline' | 'kicker' | 'labeled'", + "description": "The slot where this header's data appears in list view. The options include `primary` for the main content, `secondary` for supporting text, `labeled` for labeled data, `kicker` for small text above the primary content, or `inline` for inline content.", + "defaultValue": "'labeled'" } ], - "value": "export interface BannerSlots {\n /**\n * The main message content displayed within the banner component, providing important information or guidance to users.\n */\n children?: HTMLElement;\n /**\n * Action buttons displayed at the bottom of the banner that let users respond to the message.\n * Accepts up to two button components with `variant=\"secondary\"` or `variant=\"auto\"`.\n */\n 'secondary-actions'?: HTMLElement;\n}" + "value": "export interface TableHeaderJSXProps\n extends Partial,\n Pick {\n /**\n * The heading of the column when the table uses the `table` variant, and the label of its data when the table uses the `list` variant.\n */\n children?: ComponentChildren;\n}" } }, - "BoxSlots": { + "TableHeaderRowProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "BoxSlots", - "description": "The box component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "TableHeaderRowProps", + "description": "The properties you can set on a table header row component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", - "value": "HTMLElement", - "description": "The content displayed within the box component, which serves as a flexible container for organizing and styling other components.", + "value": "ComponentChildren", + "description": "Contents of the table heading row; children should be `TableHeading` components.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface BoxSlots {\n /**\n * The content displayed within the box component, which serves as a flexible container for organizing and styling other components.\n */\n children?: HTMLElement;\n}" + "value": "export interface TableHeaderRowProps extends TableHeaderRowProps$1 {}" } }, - "ButtonEvents": { + "TableHeaderRowJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ButtonEvents", - "description": "The button component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "TableHeaderRowJSXProps", + "description": "The JSX properties you can set on a table header row component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener | null", - "description": "A callback fired when the button loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "click", - "value": "CallbackEventListener | null", - "description": "A callback fired when the button is clicked.\n\nLearn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event)." + "name": "children", + "value": "ComponentChildren", + "description": "The content to display inside the table header row, which should include table header components.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener | null", - "description": "A callback fired when the button receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true } ], - "value": "export interface ButtonEvents {\n /**\n * A callback fired when the button is clicked.\n *\n * Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n click: CallbackEventListener | null = null;\n /**\n * A callback fired when the button loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener | null = null;\n /**\n * A callback fired when the button receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener | null = null;\n}" + "value": "export interface TableHeaderRowJSXProps\n extends Partial,\n Pick {\n /**\n * The content to display inside the table header row, which should include table header components.\n */\n children?: ComponentChildren;\n}" } }, - "ButtonSlots": { + "TableRowProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ButtonSlots", - "description": "The button component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "TableRowProps", + "description": "The properties you can set on a table row component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", - "value": "HTMLElement", - "description": "The label text or elements displayed inside the button component, describing the action that will be performed when clicked.", + "value": "ComponentChildren", + "description": "The content of a TableRow, which should be `TableCell` components.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "clickDelegate", + "value": "string", + "description": "The ID of an interactive element (e.g. `s-link`) in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally.", "isOptional": true } ], - "value": "export interface ButtonSlots {\n /**\n * The label text or elements displayed inside the button component, describing the action that will be performed when clicked.\n */\n children?: HTMLElement;\n}" + "value": "export interface TableRowProps\n extends Pick {}" } }, - "ButtonGroupSlots": { + "TableRowJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ButtonGroupSlots", - "description": "The button group component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "TableRowJSXProps", + "description": "The JSX properties you can set on a table row component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", - "value": "HTMLElement", - "description": "The buttons displayed within the button group component, which are arranged together as a cohesive set of related actions.", + "value": "ComponentChildren", + "description": "The content to display inside the row, which should include table cell components.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "primary-action", - "value": "HTMLElement", - "description": "The main action for this group, displayed with high visual emphasis. Accepts a single button with `variant=\"primary\"`.\n\nUse this for the primary action you want users to take. This can't be used when `gap=\"none\"`.", + "name": "clickDelegate", + "value": "string", + "description": "The ID of an interactive element (e.g. `s-link`) in the row that will be the target of the click when the row is clicked. This is the primary action for the row; it should not be used for secondary actions.\n\nThis is a click-only affordance, and does not introduce any keyboard or screen reader affordances. Which is why the target element must be in the table; so that keyboard and screen reader users can interact with it normally.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondary-actions", - "value": "HTMLElement", - "description": "Supporting actions displayed with less emphasis than the primary action. Accepts one or more button components with `variant=\"secondary\"` or `variant=\"auto\"`.\n\nUse these for alternative or less critical actions.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface ButtonGroupSlots {\n /**\n * The buttons displayed within the button group component, which are arranged together as a cohesive set of related actions.\n */\n children?: HTMLElement;\n /**\n * The main action for this group, displayed with high visual emphasis.\n * Accepts a single button with `variant=\"primary\"`.\n *\n * Use this for the primary action you want users to take. This can't be used when `gap=\"none\"`.\n */\n 'primary-action'?: HTMLElement;\n /**\n * Supporting actions displayed with less emphasis than the primary action.\n * Accepts one or more button components with `variant=\"secondary\"` or `variant=\"auto\"`.\n *\n * Use these for alternative or less critical actions.\n */\n 'secondary-actions'?: HTMLElement;\n}" + "value": "export interface TableRowJSXProps\n extends Partial,\n Pick {\n /**\n * The content to display inside the row, which should include table cell components.\n */\n children?: ComponentChildren;\n}" } }, - "CheckboxEvents": { + "TextProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "CheckboxEvents", - "description": "The checkbox component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "TextProps", + "description": "", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the checkbox value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the checkbox.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface CheckboxEvents {\n /**\n * A callback fired when the checkbox value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the checkbox.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n}" - } - }, - "ChipSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ChipSlots", - "description": "The chip component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "color", + "value": "'base' | 'subdued'", + "description": "The color of the text. Available options:\n- `'base'` - The default text color.\n- `'subdued'` - A lighter text color for secondary information.", + "defaultValue": "'base'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The text label displayed within the chip component, typically representing a selected filter, tag, or removable item.", - "isOptional": true + "name": "dir", + "value": "'ltr' | 'rtl' | 'auto' | ''", + "description": "Indicates the directionality of the element’s text.\n\n- `ltr`: languages written from left to right (e.g. English)\n- `rtl`: languages written from right to left (e.g. Arabic)\n- `auto`: the user agent determines the direction based on the content\n- `''`: direction is inherited from parent elements (equivalent to not setting the attribute)", + "isOptional": true, + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "graphic", - "value": "HTMLElement", - "description": "An optional icon to display at the start of the chip. Accepts only icon components.", + "name": "fontVariantNumeric", + "value": "'auto' | 'normal' | 'tabular-nums'", + "description": "The numeric font variant for the text. Available options:\n- `'auto'` - The font variant is automatically determined.\n- `'normal'` - Standard numeric rendering.\n- `'tabular-nums'` - Monospaced numbers for better alignment in tables.", + "defaultValue": "'auto' - inherit from the parent element" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto' | 'neutral' | 'caution'", + "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", + "defaultValue": "'auto'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "type", + "value": "'strong' | 'generic' | 'address' | 'redundant'", + "description": "The semantic type and styling treatment for the text content.\n\nOther presentation properties on Text override the default styling.\n\n- `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n- `generic`: Standard text with no special semantic meaning or styling.\n- `address`: Marks the text as contact information, such as a physical or email address.\n- `redundant`: Indicates the text is redundant or duplicated information for screen reader context.", + "defaultValue": "'generic'" } ], - "value": "export interface ChipSlots {\n /**\n * The text label displayed within the chip component, typically representing a selected filter, tag, or removable item.\n */\n children?: HTMLElement;\n /**\n * An optional icon to display at the start of the chip. Accepts only icon components.\n */\n graphic?: HTMLElement;\n}" + "value": "export interface TextProps\n extends Required<\n Pick<\n TextProps$1,\n | 'accessibilityVisibility'\n | 'dir'\n | 'color'\n | 'type'\n | 'tone'\n | 'fontVariantNumeric'\n | 'interestFor'\n >\n > {\n /**\n * The color of the text. Available options:\n * - `'base'` - The default text color.\n * - `'subdued'` - A lighter text color for secondary information.\n */\n color: Extract;\n /**\n * The semantic type and styling treatment for the text content.\n *\n * Other presentation properties on Text override the default styling.\n *\n * - `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n * - `generic`: Standard text with no special semantic meaning or styling.\n * - `address`: Marks the text as contact information, such as a physical or email address.\n * - `redundant`: Indicates the text is redundant or duplicated information for screen reader context.\n *\n * @default 'generic'\n */\n type: Extract<\n TextProps$1['type'],\n 'address' | 'redundant' | 'strong' | 'generic'\n >;\n /**\n * The semantic tone that's applied to the text, which changes its color to convey meaning.\n *\n * - `info`: Informational content or helpful tips (blue).\n * - `success`: Positive outcomes or successful states (green).\n * - `warning`: Important warnings about potential issues (orange).\n * - `critical`: Urgent problems or destructive actions (red).\n * - `auto`: Automatically determined based on context.\n * - `neutral`: General information without specific intent (gray).\n * - `caution`: Advisory notices that need attention (yellow).\n *\n * @default 'auto'\n */\n tone: Extract<\n TextProps$1['tone'],\n 'auto' | 'neutral' | 'info' | 'success' | 'warning' | 'caution' | 'critical'\n >;\n /**\n * The numeric font variant for the text. Available options:\n * - `'auto'` - The font variant is automatically determined.\n * - `'normal'` - Standard numeric rendering.\n * - `'tabular-nums'` - Monospaced numbers for better alignment in tables.\n */\n fontVariantNumeric: Extract<\n TextProps$1['fontVariantNumeric'],\n 'auto' | 'normal' | 'tabular-nums'\n >;\n}" } }, - "ChoiceSlots": { + "TextJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ChoiceSlots", - "description": "The choice list component supports slots for additional content placement within each choice. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "TextJSXProps", + "description": "The JSX properties for the text component. These properties define how text is rendered in Preact or JSX.", "isPublicDocs": true, "members": [ + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "accessibilityVisibility", + "value": "'visible' | 'hidden' | 'exclusive'", + "description": "Changes the visibility of the element.\n\n- `visible`: the element is visible to all users.\n- `hidden`: the element is removed from the accessibility tree but remains visible.\n- `exclusive`: the element is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", - "value": "HTMLElement", - "description": "The label text or elements that identify this selectable choice to users.\n\nThe label is produced by extracting and concatenating the text nodes from the provided content; any markup or element structure is ignored.", + "value": "ComponentChildren", + "description": "The content of the text.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "details", - "value": "HTMLElement", - "description": "Additional text to provide context or guidance for the input.\n\nThis text is displayed along with the input and its label to offer more information or instructions to the user.", + "name": "color", + "value": "'base' | 'subdued'", + "description": "The color of the text. Available options:\n- `'base'` - The default text color.\n- `'subdued'` - A lighter text color for secondary information.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "dir", + "value": "'ltr' | 'rtl' | 'auto' | ''", + "description": "Indicates the directionality of the element’s text.\n\n- `ltr`: languages written from left to right (e.g. English)\n- `rtl`: languages written from right to left (e.g. Arabic)\n- `auto`: the user agent determines the direction based on the content\n- `''`: direction is inherited from parent elements (equivalent to not setting the attribute)", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "fontVariantNumeric", + "value": "'auto' | 'normal' | 'tabular-nums'", + "description": "The numeric font variant for the text. Available options:\n- `'auto'` - The font variant is automatically determined.\n- `'normal'` - Standard numeric rendering.\n- `'tabular-nums'` - Monospaced numbers for better alignment in tables.", + "defaultValue": "'auto' - inherit from the parent element" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true - } - ], - "value": "export interface ChoiceSlots {\n /**\n * The label text or elements that identify this selectable choice to users.\n *\n * The label is produced by extracting and\n * concatenating the text nodes from the provided content;\n * any markup or element structure is ignored.\n */\n children?: HTMLElement;\n /**\n * Additional text to provide context or guidance for the input.\n *\n * This text is displayed along with the input and its label\n * to offer more information or instructions to the user.\n *\n * @implementation this content should be linked to the input with an `aria-describedby` attribute.\n */\n details?: HTMLElement;\n}" - } - }, - "ChoiceListEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ChoiceListEvents", - "description": "The choice list component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener | null", - "description": "A callback fired when the choice list selection changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "interestFor", + "value": "string", + "description": "ID of a component that should respond to interest (e.g. hover and focus) on this component.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "tone", + "value": "'info' | 'success' | 'warning' | 'critical' | 'auto' | 'neutral' | 'caution'", + "description": "The semantic tone that's applied to the text, which changes its color to convey meaning.\n\n- `info`: Informational content or helpful tips (blue).\n- `success`: Positive outcomes or successful states (green).\n- `warning`: Important warnings about potential issues (orange).\n- `critical`: Urgent problems or destructive actions (red).\n- `auto`: Automatically determined based on context.\n- `neutral`: General information without specific intent (gray).\n- `caution`: Advisory notices that need attention (yellow).", + "defaultValue": "'auto'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener | null", - "description": "A callback fired when the user inputs data into the choice list.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." + "name": "type", + "value": "'strong' | 'generic' | 'address' | 'redundant'", + "description": "The semantic type and styling treatment for the text content.\n\nOther presentation properties on Text override the default styling.\n\n- `strong`: Emphasizes the text with strong importance, typically displayed in bold.\n- `generic`: Standard text with no special semantic meaning or styling.\n- `address`: Marks the text as contact information, such as a physical or email address.\n- `redundant`: Indicates the text is redundant or duplicated information for screen reader context.", + "defaultValue": "'generic'" } ], - "value": "export interface ChoiceListEvents {\n /**\n * A callback fired when the choice list selection changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener | null = null;\n /**\n * A callback fired when the user inputs data into the choice list.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener | null = null;\n}" + "value": "export interface TextJSXProps\n extends Partial,\n Pick {\n /**\n * The content of the text.\n */\n children?: ComponentChildren;\n}" } }, - "ChoiceListSlots": { + "TextAreaProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ChoiceListSlots", - "description": "The choice list component supports slots for additional content placement within each choice. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The choices a user can select from.\n\nAccepts choice components.", - "isOptional": true - } - ], - "value": "export interface ChoiceListSlots {\n /**\n * The choices a user can select from.\n *\n * Accepts choice components.\n */\n children?: HTMLElement;\n}" + "syntaxKind": "TypeAliasDeclaration", + "name": "TextAreaProps", + "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required>", + "description": "The properties for the text area component. These properties configure a multi-line text input field that allows merchants to enter and edit longer text content.", + "isPublicDocs": true } }, - "ClickableEvents": { + "TextAreaJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ClickableEvents", - "description": "The clickable component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "TextAreaJSXProps", + "description": "The JSX props for the text area component. These properties extend `TextAreaProps` with JSX-specific event callbacks for React-style event handling.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener | null", - "description": "A callback fired when the component loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "click", - "value": "CallbackEventListener | null", - "description": "A callback fired when the component is clicked.\n\nLearn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event)." + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener | null", - "description": "A callback fired when the component receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." - } - ], - "value": "export interface ClickableEvents {\n /**\n * A callback fired when the component is clicked.\n *\n * Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n click: CallbackEventListener | null = null;\n /**\n * A callback fired when the component loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener | null = null;\n /**\n * A callback fired when the component receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener | null = null;\n}" - } - }, - "ClickableSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ClickableSlots", - "description": "The clickable component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The content displayed within the clickable component, which makes any content interactive and clickable without the semantic meaning of a button or link.", - "isOptional": true - } - ], - "value": "export interface ClickableSlots {\n /**\n * The content displayed within the clickable component, which makes any content interactive and clickable without the semantic meaning of a button or link.\n */\n children?: HTMLElement;\n}" - } - }, - "ClickableChipEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ClickableChipEvents", - "description": "The clickable chip component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "maxLength", + "value": "number", + "description": "Specifies the maximum number of characters allowed.", + "isOptional": true, + "defaultValue": "Infinity" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "afterhide", - "value": "CallbackEventListener | null", - "description": "A callback fired after the chip is hidden." + "name": "minLength", + "value": "number", + "description": "Specifies the min number of characters allowed.", + "isOptional": true, + "defaultValue": "0" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "click", - "value": "CallbackEventListener | null", - "description": "A callback fired when the chip is clicked.\n\nLearn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event)." + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "remove", - "value": "CallbackEventListener | null", - "description": "A callback fired when the chip is removed." - } - ], - "value": "export interface ClickableChipEvents {\n /**\n * A callback fired when the chip is clicked.\n *\n * Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n click: CallbackEventListener | null = null;\n /**\n * A callback fired when the chip is removed.\n */\n remove: CallbackEventListener | null = null;\n /**\n * A callback fired after the chip is hidden.\n */\n afterhide: CallbackEventListener | null = null;\n}" - } - }, - "ClickableChipSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ClickableChipSlots", - "description": "The clickable chip component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The text label displayed within the chip, which represents an interactive filter, tag, or selectable item.", + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user has finished editing the field, such as when they blur the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "graphic", - "value": "HTMLElement", - "description": "An optional icon to display at the start of the chip. Accepts only icon components.", + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", "isOptional": true - } - ], - "value": "export interface ClickableChipSlots {\n /**\n * The text label displayed within the chip, which represents an interactive filter, tag, or selectable item.\n */\n children?: HTMLElement;\n /**\n * An optional icon to display at the start of the chip. Accepts only icon components.\n */\n graphic?: HTMLElement;\n}" - } - }, - "ColorFieldEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ColorFieldEvents", - "description": "The color field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the color field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user makes changes to the field value. This fires before `onChange`.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the color field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the color field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the color field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface ColorFieldEvents {\n /**\n * A callback fired when the color field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the color field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the color field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the color field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" - } - }, - "ColorPickerEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ColorPickerEvents", - "description": "The color picker component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener | null", - "description": "A callback fired when the color picker value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "rows", + "value": "number", + "description": "A number of visible text lines.", + "isOptional": true, + "defaultValue": "2" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener | null", - "description": "A callback fired when the user inputs data into the color picker.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", + "isOptional": true } ], - "value": "export interface ColorPickerEvents {\n /**\n * A callback fired when the color picker value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener | null = null;\n /**\n * A callback fired when the user inputs data into the color picker.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener | null = null;\n}" + "value": "export interface TextAreaJSXProps\n extends Partial>,\n Pick,\n FieldReactProps,\n FieldSlotInternalReactProps {}" } }, - "DateFieldEvents": { + "TextFieldJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "DateFieldEvents", - "description": "The date field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "TextFieldJSXProps", + "description": "The JSX props for the text field component. These properties extend `TextFieldProps` with JSX-specific event callbacks and an accessory slot for rendering additional content at the end of the field.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the date field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "accessory", + "value": "ComponentChildren", + "description": "An accessory element to display at the end of the text field, such as a button, icon, or other interactive component. This appears inside the field's visual boundary, typically for actions like clearing the field or showing additional options.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the date field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the date field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the date field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." + "name": "details", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "invalid", - "value": "CallbackEventListener | null", - "description": "A callback fired when the date field value is invalid.\n\nLearn more about the [invalid event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/invalid_event)." + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "viewchange", - "value": "CallbackEventListener | null", - "description": "A callback fired when the calendar view changes (such as when navigating between months)." - } - ], - "value": "export interface DateFieldEvents {\n /**\n * A callback fired when the date field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the date field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the date field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the date field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n /**\n * A callback fired when the calendar view changes (such as when navigating between months).\n */\n viewchange: CallbackEventListener | null = null;\n /**\n * A callback fired when the date field value is invalid.\n *\n * Learn more about the [invalid event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/invalid_event).\n */\n invalid: CallbackEventListener | null = null;\n}" - } - }, - "DatePickerEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "DatePickerEvents", - "description": "The date picker component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener | null", - "description": "A callback fired when the date picker loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "icon", + "value": "IconType | AnyString", + "description": "The type of icon to be displayed in the field.", + "isOptional": true, + "defaultValue": "''" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener | null", - "description": "A callback fired when the date picker value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener | null", - "description": "A callback fired when the date picker receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener | null", - "description": "A callback fired when the user inputs data into the date picker.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "viewchange", - "value": "CallbackEventListener | null", - "description": "A callback fired when the calendar view changes, such as when navigating between months." - } - ], - "value": "export interface DatePickerEvents {\n /**\n * A callback fired when the calendar view changes, such as when navigating between months.\n */\n viewchange: CallbackEventListener | null = null;\n /**\n * A callback fired when the date picker receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener | null = null;\n /**\n * A callback fired when the date picker loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener | null = null;\n /**\n * A callback fired when the user inputs data into the date picker.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener | null = null;\n /**\n * A callback fired when the date picker value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener | null = null;\n}" - } - }, - "DropZoneEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "DropZoneEvents", - "description": "The drop zone component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "maxLength", + "value": "number", + "description": "Specifies the maximum number of characters allowed.", + "isOptional": true, + "defaultValue": "Infinity" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener", - "description": "A callback fired when the drop zone value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "minLength", + "value": "number", + "description": "Specifies the min number of characters allowed.", + "isOptional": true, + "defaultValue": "0" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "droprejected", - "value": "CallbackEventListener", - "description": "A callback fired when a dropped file is rejected due to file type or size restrictions." + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener", - "description": "A callback fired when the user inputs data into the drop zone.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface DropZoneEvents {\n /**\n * A callback fired when the drop zone value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener = null;\n /**\n * A callback fired when the user inputs data into the drop zone.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener = null;\n /**\n * A callback fired when a dropped file is rejected due to file type or size restrictions.\n */\n droprejected: CallbackEventListener = null;\n}" - } - }, - "DropZoneSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "DropZoneSlots", - "description": "The drop zone component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The content to include inside the drop zone container", + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user has finished editing the field, such as when they blur the field.", "isOptional": true - } - ], - "value": "export interface DropZoneSlots {\n /**\n * The content to include inside the drop zone container\n */\n children?: HTMLElement;\n}" - } - }, - "EmailFieldEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "EmailFieldEvents", - "description": "The email field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the email field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the email field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user makes changes to the field value. This fires before `onChange`.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the email field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the email field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface EmailFieldEvents {\n /**\n * A callback fired when the email field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the email field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the email field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the email field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" - } - }, - "GridSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "GridSlots", - "description": "The grid component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "prefix", + "value": "string", + "description": "A value to be displayed immediately before the editable portion of the field.\n\nThis is useful for displaying an implied part of the value, such as \"https://\" or \"+353\".\n\nThis cannot be edited by the user, and it isn't included in the value of the field.\n\nIt may not be displayed until the user has interacted with the input. For example, an inline label may take the place of the prefix until the user focuses the input.", + "isOptional": true, + "defaultValue": "''" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The child elements displayed within the grid component, which are arranged in a flexible grid layout with configurable columns, rows, and spacing.", - "isOptional": true - } - ], - "value": "export interface GridSlots {\n /**\n * The child elements displayed within the grid component, which are arranged in a flexible grid layout with configurable columns, rows, and spacing.\n */\n children?: HTMLElement;\n}" - } - }, - "GridItemSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "GridItemSlots", - "description": "The grid item component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The content displayed within the grid item component, which represents a single cell in the grid layout and can span multiple columns or rows.", - "isOptional": true - } - ], - "value": "export interface GridItemSlots {\n /**\n * The content displayed within the grid item component, which represents a single cell in the grid layout and can span multiple columns or rows.\n */\n children?: HTMLElement;\n}" - } - }, - "HeadingSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "HeadingSlots", - "description": "The heading component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The heading text displayed within the heading component, which provides a title or section header for content.", + "name": "suffix", + "value": "string", + "description": "A value to be displayed immediately after the editable portion of the field.\n\nThis is useful for displaying an implied part of the value, such as \"@shopify.com\", or \"%\".\n\nThis cannot be edited by the user, and it isn't included in the value of the field.\n\nIt may not be displayed until the user has interacted with the input. For example, an inline label may take the place of the suffix until the user focuses the input.", + "isOptional": true, + "defaultValue": "''" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true } ], - "value": "export interface HeadingSlots {\n /**\n * The heading text displayed within the heading component, which provides a title or section header for content.\n */\n children?: HTMLElement;\n}" + "value": "export interface TextFieldJSXProps\n extends Partial>,\n Pick,\n FieldReactProps,\n FieldSlotInternalReactProps {\n /**\n * An accessory element to display at the end of the text field, such as a button, icon, or other interactive component. This appears inside the field's visual boundary, typically for actions like clearing the field or showing additional options.\n */\n accessory?: ComponentChildren;\n}" } }, - "ImageEvents": { + "ThumbnailProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ImageEvents", - "description": "The image component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "ThumbnailProps", + "description": "The properties for the thumbnail component. A thumbnail displays a small preview image with configurable sizing. Properties include `src` for the image URL, `alt` for accessibility text, and `size` for controlling the thumbnail dimensions.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", - "value": "OnErrorEventHandler", - "description": "A callback fired when the image fails to load.\n\nLearn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event)." + "name": "alt", + "value": "string", + "description": "Alternative text that describes the image for screen readers. This text should convey the meaning or content of the image to users who can't see it.", + "defaultValue": "`''`" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "load", - "value": "CallbackEventListener | null", - "description": "A callback fired when the image successfully loads.\n\nLearn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event)." - } - ], - "value": "export interface ImageEvents {\n /**\n * A callback fired when the image successfully loads.\n *\n * Learn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback fired when the image fails to load.\n *\n * Learn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).\n */\n error: OnErrorEventHandler = null;\n}" - } - }, - "LinkEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "LinkEvents", - "description": "The link component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "size", + "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100'", + "description": "The size of the thumbnail. Choose from `'small-200'`, `'small-100'`, `'small'`, `'base'`, `'large'`, or `'large-100'` to control the thumbnail dimensions.", + "defaultValue": "'base'" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "click", - "value": "CallbackEventListener | null", - "description": "A callback fired when the link is clicked.\n\nLearn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event)." + "name": "src", + "value": "string", + "description": "The URL of the image to display in the thumbnail. You can provide an absolute or relative URL pointing to the image file." } ], - "value": "export interface LinkEvents {\n /**\n * A callback fired when the link is clicked.\n *\n * Learn more about the [click event](https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event).\n */\n click: CallbackEventListener | null = null;\n}" + "value": "export interface ThumbnailProps\n extends Required> {\n /**\n * The URL of the image to display in the thumbnail. You can provide an absolute or relative URL pointing to the image file.\n */\n src: ThumbnailProps$1['src'];\n /**\n * Alternative text that describes the image for screen readers. This text should convey the meaning or content of the image to users who can't see it.\n */\n alt: ThumbnailProps$1['alt'];\n /**\n * The size of the thumbnail. Choose from `'small-200'`, `'small-100'`, `'small'`, `'base'`, `'large'`, or `'large-100'` to control the thumbnail dimensions.\n *\n * @default 'base'\n */\n size: Extract<\n ThumbnailProps$1['size'],\n 'small-200' | 'small-100' | 'small' | 'base' | 'large' | 'large-100'\n >;\n}" } }, - "LinkSlots": { + "ThumbnailJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "LinkSlots", - "description": "The link component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "ThumbnailJSXProps", + "description": "The properties for the thumbnail component when it's used in JSX.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The text or elements displayed within the link component, which navigates users to a different location when activated.", + "name": "alt", + "value": "string", + "description": "Alternative text that describes the image for screen readers. This text should convey the meaning or content of the image to users who can't see it.", + "defaultValue": "`''`" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true - } - ], - "value": "export interface LinkSlots {\n /**\n * The text or elements displayed within the link component, which navigates users to a different location when activated.\n */\n children?: HTMLElement;\n}" - } - }, - "ListItemSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ListItemSlots", - "description": "The list item component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The content displayed within the list item, which represents a single entry in an ordered or unordered list.", + "name": "onError", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired when the image fails to load.", "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onLoad", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's fired when the image has loaded successfully.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "size", + "value": "'small' | 'small-200' | 'small-100' | 'base' | 'large' | 'large-100'", + "description": "The size of the thumbnail. Choose from `'small-200'`, `'small-100'`, `'small'`, `'base'`, `'large'`, or `'large-100'` to control the thumbnail dimensions.", + "defaultValue": "'base'" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "src", + "value": "string", + "description": "The URL of the image to display in the thumbnail. You can provide an absolute or relative URL pointing to the image file." } ], - "value": "export interface ListItemSlots {\n /**\n * The content displayed within the list item, which represents a single entry in an ordered or unordered list.\n */\n children?: HTMLElement;\n}" + "value": "export interface ThumbnailJSXProps\n extends Partial,\n Pick {\n /**\n * A callback that's fired when the image has loaded successfully.\n */\n onLoad?: ((event: CallbackEvent) => void) | null;\n /**\n * A callback that's fired when the image fails to load.\n */\n onError?: ((event: CallbackEvent) => void) | null;\n}" } }, - "MenuSlots": { + "TooltipProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "MenuSlots", - "description": "The menu component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "TooltipProps", + "description": "The properties you can set on a tooltip component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The items displayed within the menu. Only accepts button and section components. Use button for individual menu actions and section to group related items.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface MenuSlots {\n /**\n * The items displayed within the menu. Only accepts button and section components. Use button for individual menu actions and section to group related items.\n */\n children?: HTMLElement;\n}" + "value": "export interface TooltipProps extends Required> {}" } }, - "ModalEvents": { + "TooltipJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ModalEvents", - "description": "The modal component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "TooltipJSXProps", + "description": "The JSX properties you can set on a tooltip component.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "afterhide", - "value": "CallbackEventListener | null", - "description": "A callback fired after the modal is hidden." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "aftershow", - "value": "CallbackEventListener | null", - "description": "A callback fired after the modal is shown." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "hide", - "value": "CallbackEventListener | null", - "description": "A callback fired when the modal is hidden." + "name": "children", + "value": "ComponentChildren", + "description": "The content to display inside the tooltip, which should include text or paragraph components, or raw text content.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "show", - "value": "CallbackEventListener | null", - "description": "A callback fired when the modal is shown." + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true } ], - "value": "export interface ModalEvents {\n /**\n * A callback fired when the modal is hidden.\n */\n hide: CallbackEventListener | null = null;\n /**\n * A callback fired when the modal is shown.\n */\n show: CallbackEventListener | null = null;\n /**\n * A callback fired after the modal is hidden.\n */\n afterhide: CallbackEventListener | null = null;\n /**\n * A callback fired after the modal is shown.\n */\n aftershow: CallbackEventListener | null = null;\n}" + "value": "export interface TooltipJSXProps\n extends Partial,\n Pick {\n /**\n * The content to display inside the tooltip, which should include text or paragraph components, or raw text content.\n */\n children?: ComponentChildren;\n}" + } + }, + "URLFieldProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "TypeAliasDeclaration", + "name": "URLFieldProps", + "value": "PreactFieldProps<\n Required['autocomplete']\n> & Required>", + "description": "The properties for the URL field component. These properties configure an input field that allows merchants to enter and validate web addresses (URLs) with built-in validation.", + "isPublicDocs": true } }, - "ModalSlots": { + "URLFieldJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ModalSlots", - "description": "The modal component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "URLFieldJSXProps", + "description": "The JSX props for the URL field component. These properties extend `URLFieldProps` with JSX-specific event callbacks for React-style event handling when used in Preact.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The content displayed within the modal component, typically including form fields, information, or interactive elements.", - "isOptional": true + "name": "autocomplete", + "value": "Autocomplete", + "description": "A hint as to the intended content of the field.\n\nWhen set to `on` (the default), this property indicates that the field should support autofill, but you do not have any more semantic information on the intended contents.\n\nWhen set to `off`, you are indicating that this field contains sensitive information, or contents that are never saved, like one-time codes.\n\nAlternatively, you can provide value which describes the specific data you would like to be entered into this field during autofill.", + "defaultValue": "'on' for everything else" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "primary-action", - "value": "HTMLElement", - "description": "The main action button displayed in the modal footer, representing the primary action users should take.\n\nOnly accepts a single button component with a `variant` of `primary`. This action should align with the modal's main purpose.", + "name": "defaultValue", + "value": "string", + "description": "The default value for the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondary-actions", - "value": "HTMLElement", - "description": "Additional action buttons displayed in the modal footer, providing alternative or supporting actions.\n\nOnly accepts button components with a `variant` of `secondary` or `auto`. These are visually de-emphasized to establish clear hierarchy.", + "name": "details", + "value": "preact.ComponentChildren", + "description": "", "isOptional": true - } - ], - "value": "export interface ModalSlots {\n /**\n * The content displayed within the modal component, typically including form fields, information, or interactive elements.\n */\n children?: HTMLElement;\n /**\n * The main action button displayed in the modal footer, representing the primary action users should take.\n *\n * Only accepts a single button component with a `variant` of `primary`. This action should align with the modal's main purpose.\n */\n 'primary-action'?: HTMLElement;\n /**\n * Additional action buttons displayed in the modal footer, providing alternative or supporting actions.\n *\n * Only accepts button components with a `variant` of `secondary` or `auto`. These are visually de-emphasized to establish clear hierarchy.\n */\n 'secondary-actions'?: HTMLElement;\n}" - } - }, - "MoneyFieldEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "MoneyFieldEvents", - "description": "The money field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the money field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "disabled", + "value": "boolean", + "description": "Disables the field, disallowing any interaction.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the money field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "error", + "value": "preact.ComponentChildren", + "description": "", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the money field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the money field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface MoneyFieldEvents {\n /**\n * A callback fired when the money field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the money field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the money field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the money field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" - } - }, - "NumberFieldEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "NumberFieldEvents", - "description": "The number field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "label", + "value": "string | ComponentChildren", + "description": "Content to use as the field label.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the number field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "labelAccessibilityVisibility", + "value": "'visible' | 'exclusive'", + "description": "Changes the visibility of the component's label.\n\n- `visible`: the label is visible to all users.\n- `exclusive`: the label is visually hidden but remains in the accessibility tree.", + "isOptional": true, + "defaultValue": "'visible'" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the number field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "maxLength", + "value": "number", + "description": "Specifies the maximum number of characters allowed.", + "isOptional": true, + "defaultValue": "Infinity" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the number field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "minLength", + "value": "number", + "description": "Specifies the min number of characters allowed.", + "isOptional": true, + "defaultValue": "0" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the number field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface NumberFieldEvents {\n /**\n * A callback fired when the number field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the number field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the number field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the number field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" - } - }, - "OptionSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "OptionSlots", - "description": "The option component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "name", + "value": "string", + "description": "An identifier for the field that is unique within the nearest containing form.", + "isOptional": true + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The text or elements displayed as the option label, which identifies the selectable choice to users in a dropdown or selection list.", + "name": "onBlur", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field loses focus.", "isOptional": true - } - ], - "value": "export interface OptionSlots {\n /**\n * The text or elements displayed as the option label, which identifies the selectable choice to users in a dropdown or selection list.\n */\n children?: HTMLElement;\n}" - } - }, - "OptionGroupSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "OptionGroupSlots", - "description": "The option group component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The selectable options displayed in the dropdown list. Accepts option components for individual selectable items within this group.", + "name": "onChange", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user has finished editing the field, such as when they blur the field.", "isOptional": true - } - ], - "value": "export interface OptionGroupSlots {\n /**\n * The selectable options displayed in the dropdown list. Accepts option components for individual selectable items within this group.\n */\n children?: HTMLElement;\n}" - } - }, - "OrderedListSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "OrderedListSlots", - "description": "The ordered list component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The list entries displayed within the ordered list, where each item is numbered sequentially. Only accepts list item components as children. Each list item represents a single numbered entry in the sequence.", + "name": "onFocus", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the field receives focus.", "isOptional": true - } - ], - "value": "export interface OrderedListSlots {\n /**\n * The list entries displayed within the ordered list, where each item is numbered sequentially. Only accepts list item components as children. Each list item represents a single numbered entry in the sequence.\n */\n children?: HTMLElement;\n}" - } - }, - "PageSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "PageSlots", - "description": "The page component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "aside", - "value": "HTMLElement", - "description": "The content to display in the aside section of the page.\n\nThis slot is only rendered when `inlineSize` is \"base\".", + "name": "onInput", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback fired when the user makes changes to the field value. This fires before `onChange`.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "breadcrumb-actions", - "value": "HTMLElement", - "description": "The navigation back actions for the page.\n\nOnly accepts link components.", + "name": "placeholder", + "value": "string", + "description": "A short hint that describes the expected value of the field.", "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The main page content displayed within the page component, which serves as the primary container for the page's information and interface elements.", - "isOptional": true + "name": "readOnly", + "value": "boolean", + "description": "The field cannot be edited by the user. It is focusable will be announced by screen readers.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "primary-action", - "value": "HTMLElement", - "description": "The primary action for the page.\n\nOnly accepts a single button component with a `variant` of `primary`.", - "isOptional": true + "name": "required", + "value": "boolean", + "description": "Whether the field needs a value. This requirement adds semantic value to the field, but it will not cause an error to appear automatically. If you want to present an error when this field is empty, you can do so with the `error` property.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondary-actions", - "value": "HTMLElement", - "description": "The secondary actions for the page.\n\nOnly accepts button group and button components with a `variant` of `secondary` or `auto`.", + "name": "value", + "value": "string", + "description": "The current value for the field. If omitted, the field will be empty.", "isOptional": true } ], - "value": "export interface PageSlots {\n /**\n * The main page content displayed within the page component, which serves as the primary container for the page's information and interface elements.\n */\n children?: HTMLElement;\n /**\n * The content to display in the aside section of the page.\n *\n * This slot is only rendered when `inlineSize` is \"base\".\n */\n aside?: HTMLElement;\n /**\n * The primary action for the page.\n *\n * Only accepts a single button component with a `variant` of `primary`.\n *\n */\n 'primary-action'?: HTMLElement;\n /**\n * The secondary actions for the page.\n *\n * Only accepts button group and button components with a `variant` of `secondary` or `auto`.\n */\n 'secondary-actions'?: HTMLElement;\n /**\n * The navigation back actions for the page.\n *\n * Only accepts link components.\n */\n 'breadcrumb-actions'?: HTMLElement;\n}" + "value": "export interface URLFieldJSXProps\n extends Partial>,\n Pick,\n FieldReactProps,\n FieldSlotInternalReactProps {}" } }, - "ParagraphSlots": { + "UnorderedListProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "ParagraphSlots", - "description": "The paragraph component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "UnorderedListProps", + "description": "The properties for the unordered list component. These properties define a bulleted list of items where the order doesn't matter.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "children", - "value": "HTMLElement", - "description": "The paragraph text content displayed within the paragraph component, which presents a block of related text with appropriate styling.", + "value": "ComponentChildren", + "description": "The content of the UnorderededList.\n\nAccepts only `ListItem` components.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface ParagraphSlots {\n /**\n * The paragraph text content displayed within the paragraph component, which presents a block of related text with appropriate styling.\n */\n children?: HTMLElement;\n}" + "value": "export interface UnorderedListProps extends UnorderedListProps$1 {}" } }, - "PasswordFieldEvents": { + "UnorderedListJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "PasswordFieldEvents", - "description": "The password field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "UnorderedListJSXProps", + "description": "The JSX properties for the unordered list component. These properties define how an unordered list is rendered in Preact or JSX.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the password field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "children", + "value": "ComponentChildren", + "description": "The items in the unordered list. Only list item components are accepted.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the password field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." - }, + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true + } + ], + "value": "export interface UnorderedListJSXProps\n extends Partial,\n Pick {\n /**\n * The items in the unordered list. Only list item components are accepted.\n */\n children?: ComponentChildren;\n}" + } + }, + "AdminActionProps": { + "src/surfaces/admin/components.ts": { + "filePath": "src/surfaces/admin/components.ts", + "name": "AdminActionProps", + "description": "The properties for the admin action component. These properties configure the heading and loading state of the admin action extension interface.", + "isPublicDocs": true, + "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the password field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "heading", + "value": "string", + "description": "The text to use as the Action modal’s title. If not provided, the name of the extension will be used.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the password field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." + "name": "loading", + "value": "boolean", + "description": "Whether the action is in a loading state, such as initial page load or action opening. When true, the action could be in an inert state, which prevents user interaction.", + "isOptional": true, + "defaultValue": "false" } ], - "value": "export interface PasswordFieldEvents {\n /**\n * A callback fired when the password field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the password field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the password field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the password field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface AdminActionProps\n extends Pick {}" } }, - "PopoverEvents": { + "AdminActionJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "PopoverEvents", - "description": "The popover component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "AdminActionJSXProps", + "description": "The JSX props for the admin action component. These properties extend `AdminActionProps` with slots for primary and secondary action buttons that merchants can interact with.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "afterhide", - "value": "CallbackEventListener | null", - "description": "A callback fired after the popover is hidden." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "aftershow", - "value": "CallbackEventListener | null", - "description": "A callback fired after the popover is shown." + "name": "heading", + "value": "string", + "description": "The text to use as the Action modal’s title. If not provided, the name of the extension will be used.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "aftertoggle", - "value": "CallbackEventListener | null", - "description": "A callback fired after the popover is toggled." + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "hide", - "value": "CallbackEventListener | null", - "description": "A callback fired when the popover is hidden." + "name": "loading", + "value": "boolean", + "description": "Whether the action is in a loading state, such as initial page load or action opening. When true, the action could be in an inert state, which prevents user interaction.", + "isOptional": true, + "defaultValue": "false" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "show", - "value": "CallbackEventListener | null", - "description": "A callback fired when the popover is shown." + "name": "primaryAction", + "value": "ComponentChildren", + "description": "The primary action button or link to display in the admin action area. This is the main call-to-action that appears prominently in the interface. Typically uses a button component with `variant=\"primary\"` to complete or advance the workflow." }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "toggle", - "value": "CallbackEventListener | null", - "description": "A callback fired when the popover is toggled." + "name": "secondaryActions", + "value": "ComponentChildren", + "description": "The secondary action buttons or links to display in the admin action area. These are supporting actions like cancel, back, or alternative operations. Typically uses button components with `variant=\"secondary\"` or `variant=\"tertiary\"`." } ], - "value": "export interface PopoverEvents {\n /**\n * A callback fired when the popover is shown.\n */\n show: CallbackEventListener | null;\n /**\n * A callback fired when the popover is hidden.\n */\n hide: CallbackEventListener | null;\n /**\n * A callback fired after the popover is shown.\n */\n aftershow: CallbackEventListener | null;\n /**\n * A callback fired after the popover is hidden.\n */\n afterhide: CallbackEventListener | null;\n /**\n * A callback fired when the popover is toggled.\n */\n toggle: CallbackEventListener | null;\n /**\n * A callback fired after the popover is toggled.\n */\n aftertoggle: CallbackEventListener | null;\n}" + "value": "export interface AdminActionJSXProps\n extends Partial,\n Pick {\n /**\n * The primary action button or link to display in the admin action area. This is the main call-to-action that appears prominently in the interface. Typically uses a button component with `variant=\"primary\"` to complete or advance the workflow.\n */\n primaryAction: ComponentChildren;\n /**\n * The secondary action buttons or links to display in the admin action area. These are supporting actions like cancel, back, or alternative operations. Typically uses button components with `variant=\"secondary\"` or `variant=\"tertiary\"`.\n */\n secondaryActions: ComponentChildren;\n}" } }, - "PopoverSlots": { + "AdminBlockProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "PopoverSlots", - "description": "The popover component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "AdminBlockProps", + "description": "The properties for the admin block component. These properties configure the heading and collapsed summary of collapsible content blocks in the admin interface.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The content displayed within the popover component, which appears in an overlay positioned relative to its trigger element.", + "name": "collapsedSummary", + "value": "string", + "description": "The summary to display when the app block is collapsed. Summary longer than 30 characters will be truncated.", "isOptional": true - } - ], - "value": "export interface PopoverSlots {\n /**\n * The content displayed within the popover component, which appears in an overlay positioned relative to its trigger element.\n */\n children?: HTMLElement;\n}" - } - }, - "QueryContainerSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "QueryContainerSlots", - "description": "The query container component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The content displayed within the query container component, which enables container queries for responsive styling based on the container's size rather than the viewport.", + "name": "heading", + "value": "string", + "description": "The text to use as the Block title in the block header. If not provided, the name of the extension will be used.", "isOptional": true } ], - "value": "export interface QueryContainerSlots {\n /**\n * The content displayed within the query container component, which enables container queries for responsive styling based on the container's size rather than the viewport.\n */\n children?: HTMLElement;\n}" + "value": "export interface AdminBlockProps\n extends Pick {}" } }, - "SearchFieldEvents": { + "AdminBlockJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "SearchFieldEvents", - "description": "The search field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "AdminBlockJSXProps", + "description": "The JSX props for the admin block component. These properties extend `AdminBlockProps` with an optional `id` for element identification in JSX rendering.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the search field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." - }, - { - "filePath": "src/surfaces/admin/components.ts", - "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the search field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "collapsedSummary", + "value": "string", + "description": "The summary to display when the app block is collapsed. Summary longer than 30 characters will be truncated.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the search field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "heading", + "value": "string", + "description": "The text to use as the Block title in the block header. If not provided, the name of the extension will be used.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the search field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true } ], - "value": "export interface SearchFieldEvents {\n /**\n * A callback fired when the search field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the search field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the search field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the search field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" + "value": "export interface AdminBlockJSXProps\n extends Partial,\n Pick {}" } }, - "SectionSlots": { + "AdminPrintActionProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "SectionSlots", - "description": "The section component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "AdminPrintActionProps", + "description": "The properties for the admin print action component. These properties configure the source URL for printing content within admin extensions.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The content displayed within the section component, which groups related elements together in a logical unit with an optional heading.", + "name": "src", + "value": "string", + "description": "Sets the src URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs and images are supported.", "isOptional": true } ], - "value": "export interface SectionSlots {\n /**\n * The content displayed within the section component, which groups related elements together in a logical unit with an optional heading.\n */\n children?: HTMLElement;\n}" + "value": "export interface AdminPrintActionProps\n extends Pick {}" } }, - "SelectEvents": { + "AdminPrintActionJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "SelectEvents", - "description": "The select component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", + "name": "AdminPrintActionJSXProps", + "description": "The JSX props for the admin print action component. These properties extend `AdminPrintActionProps` with an optional `id` for element identification in JSX rendering.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the select value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the select.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." + "name": "src", + "value": "string", + "description": "Sets the src URL of the preview and the document to print. If not provided, the preview will show an empty state and the print button will be disabled. HTML, PDFs and images are supported.", + "isOptional": true } ], - "value": "export interface SelectEvents {\n /**\n * A callback fired when the select value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the select.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n}" + "value": "export interface AdminPrintActionJSXProps\n extends Partial,\n Pick {}" } }, - "SelectSlots": { + "FormProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "SelectSlots", - "description": "The select component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "FormProps", + "description": "The properties for the form component. These properties configure the form's identifier for targeting and referencing within the admin extension.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The selectable options displayed in the dropdown list. Accepts option components for individual selectable items, and option group components to organize related options into logical groups with labels.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface SelectSlots {\n /**\n * The selectable options displayed in the dropdown list. Accepts option components for individual selectable items, and option group components to organize related options into logical groups with labels.\n */\n children?: HTMLElement;\n}" + "value": "export interface FormProps extends Pick {}" } }, - "StackSlots": { + "FormJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "StackSlots", - "description": "The stack component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "FormJSXProps", + "description": "The JSX props for the form component. These properties extend `FormProps` with event callbacks for form submission and reset actions in JSX rendering.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The child elements displayed within the stack component, which are arranged vertically or horizontally with consistent spacing.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true - } - ], - "value": "export interface StackSlots {\n /**\n * The child elements displayed within the stack component, which are arranged vertically or horizontally with consistent spacing.\n */\n children?: HTMLElement;\n}" - } - }, - "SwitchEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "SwitchEvents", - "description": "The switch component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the switch value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "onReset", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's invoked when the form is reset, restoring all form fields to their initial values.", + "isOptional": true }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the switch.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." + "name": "onSubmit", + "value": "| ((event: CallbackExtendableEvent) => void)\n | null", + "description": "A callback that's invoked when the form is submitted. Use the event's `waitUntil` method to perform async operations like validation or data processing before the submission completes.", + "isOptional": true } ], - "value": "export interface SwitchEvents {\n /**\n * A callback fired when the switch value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the switch.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n}" + "value": "export interface FormJSXProps extends Partial {\n /**\n * A callback that's invoked when the form is submitted. Use the event's `waitUntil` method to perform async operations like validation or data processing before the submission completes.\n */\n onSubmit?:\n | ((event: CallbackExtendableEvent) => void)\n | null;\n /**\n * A callback that's invoked when the form is reset, restoring all form fields to their initial values.\n */\n onReset?: ((event: CallbackEvent) => void) | null;\n}" } }, - "TableEvents": { + "CallbackExtendableEvent": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "TableEvents", - "description": "The table component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "name": "CallbackExtendableEvent", + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "nextpage", - "value": "CallbackEventListener | null", - "description": "A callback fired when the user navigates to the next page." + "name": "AT_TARGET", + "value": "2", + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "previouspage", - "value": "CallbackEventListener | null", - "description": "A callback fired when the user navigates to the previous page." - } - ], - "value": "export interface TableEvents {\n /**\n * A callback fired when the user navigates to the previous page.\n */\n previouspage: CallbackEventListener | null = null;\n /**\n * A callback fired when the user navigates to the next page.\n */\n nextpage: CallbackEventListener | null = null;\n}" - } - }, - "TableSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TableSlots", - "description": "The table component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "bubbles", + "value": "boolean", + "description": "The **`bubbles`** read-only property of the Event interface indicates whether the event bubbles up through the DOM tree or not.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/bubbles)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The table structure defining headers and data rows.\n\nAccepts table header row (for column headers) and table body (for data rows) components. Structure your table with a table header row first, followed by table body.", - "isOptional": true + "name": "BUBBLING_PHASE", + "value": "3", + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "filters", - "value": "HTMLElement", - "description": "Filter controls displayed above the table.\n\nAccepts input components like search field or select for filtering table data. These controls appear in a dedicated area above the table content.", - "isOptional": true - } - ], - "value": "export interface TableSlots {\n /**\n * The table structure defining headers and data rows.\n *\n * Accepts table header row (for column headers) and table body (for data rows) components. Structure your table with a table header row first, followed by table body.\n */\n children?: HTMLElement;\n /**\n * Filter controls displayed above the table.\n *\n * Accepts input components like search field or select for filtering table data. These controls appear in a dedicated area above the table content.\n */\n filters?: HTMLElement;\n}" - } - }, - "TableBodySlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TableBodySlots", - "description": "The table body component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "cancelable", + "value": "boolean", + "description": "The **`cancelable`** read-only property of the Event interface indicates whether the event can be canceled, and therefore prevented as if the event never happened.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelable)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The data rows displayed in the table body.\n\nAccepts table row components, with each row representing a single record or entry in the table.", - "isOptional": true - } - ], - "value": "export interface TableBodySlots {\n /**\n * The data rows displayed in the table body.\n *\n * Accepts table row components, with each row representing a single record or entry in the table.\n */\n children?: HTMLElement;\n}" - } - }, - "TableCellSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TableCellSlots", - "description": "The table cell component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "cancelBubble", + "value": "boolean", + "description": "The **`cancelBubble`** property of the Event interface is deprecated.", + "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelBubble)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The data value displayed in this cell.\n\nAccepts text content or inline components representing the cell's data value.", + "name": "CAPTURING_PHASE", + "value": "1", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "composed", + "value": "boolean", + "description": "The read-only **`composed`** property of the or not the event will propagate across the shadow DOM boundary into the standard DOM.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composed)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "composedPath", + "value": "() => EventTarget[]", + "description": "The **`composedPath()`** method of the Event interface returns the event's path which is an array of the objects on which listeners will be invoked.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composedPath)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "currentTarget", + "value": "EventTarget | null", + "description": "The **`currentTarget`** read-only property of the Event interface identifies the element to which the event handler has been attached.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/currentTarget)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultPrevented", + "value": "boolean", + "description": "The **`defaultPrevented`** read-only property of the Event interface returns a boolean value indicating whether or not the call to Event.preventDefault() canceled the event.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/defaultPrevented)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "eventPhase", + "value": "number", + "description": "The **`eventPhase`** read-only property of the being evaluated.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/eventPhase)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "initEvent", + "value": "(type: string, bubbles?: boolean, cancelable?: boolean) => void", + "description": "The **`Event.initEvent()`** method is used to initialize the value of an event created using Document.createEvent().", + "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/initEvent)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "isTrusted", + "value": "boolean", + "description": "The **`isTrusted`** read-only property of the when the event was generated by the user agent (including via user actions and programmatic methods such as HTMLElement.focus()), and `false` when the event was dispatched via The only exception is the `click` event, which initializes the `isTrusted` property to `false` in user agents.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/isTrusted)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "NONE", + "value": "0", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "preventDefault", + "value": "() => void", + "description": "The **`preventDefault()`** method of the Event interface tells the user agent that if the event does not get explicitly handled, its default action should not be taken as it normally would be.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/preventDefault)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "returnValue", + "value": "boolean", + "description": "The Event property **`returnValue`** indicates whether the default action for this event has been prevented or not.", + "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/returnValue)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "srcElement", + "value": "EventTarget | null", + "description": "The deprecated **`Event.srcElement`** is an alias for the Event.target property.", + "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/srcElement)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "stopImmediatePropagation", + "value": "() => void", + "description": "The **`stopImmediatePropagation()`** method of the If several listeners are attached to the same element for the same event type, they are called in the order in which they were added.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopImmediatePropagation)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "stopPropagation", + "value": "() => void", + "description": "The **`stopPropagation()`** method of the Event interface prevents further propagation of the current event in the capturing and bubbling phases.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopPropagation)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "target", + "value": "EventTarget | null", + "description": "The read-only **`target`** property of the dispatched.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/target)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "timeStamp", + "value": "DOMHighResTimeStamp", + "description": "The **`timeStamp`** read-only property of the Event interface returns the time (in milliseconds) at which the event was created.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/timeStamp)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "type", + "value": "string", + "description": "The **`type`** read-only property of the Event interface returns a string containing the event's type.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/type)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "waitUntil", + "value": "(promise: Promise) => void", + "description": "Provide a promise that signals the length, and eventual success or failure of actions relating to the event.\n\nThis may be called many times, which adds promises to the event.\n\nHowever, this may only be called synchronously during the dispatch of the event. As in, you cannot call it after a `setTimeout` or microtask.", "isOptional": true } ], - "value": "export interface TableCellSlots {\n /**\n * The data value displayed in this cell.\n *\n * Accepts text content or inline components representing the cell's data value.\n */\n children?: HTMLElement;\n}" + "value": "export interface CallbackExtendableEvent<\n TTagName extends keyof HTMLElementTagNameMap,\n> extends CallbackEvent,\n Pick {}" } }, - "TableHeaderSlots": { + "FunctionSettingsProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "TableHeaderSlots", - "description": "The table header component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "FunctionSettingsProps", + "description": "The properties for the function settings component. These properties configure the form's identifier for configuring Shopify Function settings in the admin interface.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The column heading text.\n\nThis text labels the column in table variant and appears as a label for data in list variant.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true } ], - "value": "export interface TableHeaderSlots {\n /**\n * The column heading text.\n *\n * This text labels the column in table variant and appears as a label for data in list variant.\n */\n children?: HTMLElement;\n}" + "value": "export interface FunctionSettingsProps\n extends Pick {}" } }, - "TableHeaderRowSlots": { + "FunctionSettingsJSXProps": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "TableHeaderRowSlots", - "description": "The table header row component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", + "name": "FunctionSettingsJSXProps", + "description": "The JSX props for the function settings component. These properties extend `FunctionSettingsProps` with event callbacks for form submission, reset, and error handling in JSX rendering.", "isPublicDocs": true, "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The column headers displayed in the table header row.\n\nAccepts table header components, with each header defining a column and providing its label.", + "name": "id", + "value": "string", + "description": "A unique identifier for the element.", "isOptional": true - } - ], - "value": "export interface TableHeaderRowSlots {\n /**\n * The column headers displayed in the table header row.\n *\n * Accepts table header components, with each header defining a column and providing its label.\n */\n children?: HTMLElement;\n}" - } - }, - "TableRowSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TableRowSlots", - "description": "The table row component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The data cells displayed in this table row.\n\nAccepts table cell components, with each cell containing a data value for the corresponding column.", + "name": "onError", + "value": "(event: AggregateErrorEvent) => void", + "description": "An optional callback function that will be run by the admin when committing the changes to Shopify’s servers fails. The error event you receive includes an `error` property that is an `AggregateError` object. This object includes an array of errors that were caused by data your extension provided. Network errors and user errors that are out of your control will not be reported here.\n\nIn the `onError` callback, you should update your extension’s UI to highlight the fields that caused the errors, and display the error messages to the user.", "isOptional": true - } - ], - "value": "export interface TableRowSlots {\n /**\n * The data cells displayed in this table row.\n *\n * Accepts table cell components, with each cell containing a data value for the corresponding column.\n */\n children?: HTMLElement;\n}" - } - }, - "TextSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TextSlots", - "description": "The text component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The text content displayed within the text component, which applies semantic meaning and styling appropriate to the specified text type.", + "name": "onReset", + "value": "((event: CallbackEvent) => void) | null", + "description": "A callback that's invoked when the function settings form is reset, restoring all form fields to their initial values.", + "isOptional": true + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "onSubmit", + "value": "((event: CallbackExtendableEvent) => void) | null", + "description": "An optional callback function that'll be run by the admin when the user commits their changes in the admin-rendered part of the function settings experience. If `event.waitUntil` is called with a promise, the admin will wait for the promise to resolve before committing any changes to Shopify’s servers. If the promise rejects, the admin will abort the changes and display an error, using the `message` property of the error you reject with.", "isOptional": true } ], - "value": "export interface TextSlots {\n /**\n * The text content displayed within the text component, which applies semantic meaning and styling appropriate to the specified text type.\n */\n children?: HTMLElement;\n}" + "value": "export interface FunctionSettingsJSXProps\n extends Partial<\n FunctionSettingsProps & Pick\n > {\n /**\n * An optional callback function that'll be run by the admin when the user\n * commits their changes in the admin-rendered part of the function settings\n * experience. If `event.waitUntil` is called with a promise, the admin will wait for the\n * promise to resolve before committing any changes to Shopify’s servers. If\n * the promise rejects, the admin will abort the changes and display an error,\n * using the `message` property of the error you reject with.\n */\n onSubmit?: ((event: CallbackExtendableEvent) => void) | null;\n /**\n * A callback that's invoked when the function settings form is reset, restoring all form fields to their initial values.\n */\n onReset?: ((event: CallbackEvent) => void) | null;\n}" } }, - "TextAreaEvents": { + "AggregateErrorEvent": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "TextAreaEvents", - "description": "The text area component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "name": "AggregateErrorEvent", + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text area loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "AT_TARGET", + "value": "2", + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text area value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "bubbles", + "value": "boolean", + "description": "The **`bubbles`** read-only property of the Event interface indicates whether the event bubbles up through the DOM tree or not.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/bubbles)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text area receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "BUBBLING_PHASE", + "value": "3", + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the text area.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface TextAreaEvents {\n /**\n * A callback fired when the text area value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the text area.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the text area loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the text area receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" - } - }, - "TextFieldEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TextFieldEvents", - "description": "The text field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "cancelable", + "value": "boolean", + "description": "The **`cancelable`** read-only property of the Event interface indicates whether the event can be canceled, and therefore prevented as if the event never happened.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelable)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "cancelBubble", + "value": "boolean", + "description": "The **`cancelBubble`** property of the Event interface is deprecated.", + "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/cancelBubble)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "CAPTURING_PHASE", + "value": "1", + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the text field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "colno", + "value": "number", + "description": "The **`colno`** read-only property of the ErrorEvent interface returns an integer containing the column number of the script file on which the error occurred.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/colno)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the text field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface TextFieldEvents {\n /**\n * A callback fired when the text field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the text field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the text field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the text field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" - } - }, - "TextFieldSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TextFieldSlots", - "description": "The text field component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "composed", + "value": "boolean", + "description": "The read-only **`composed`** property of the or not the event will propagate across the shadow DOM boundary into the standard DOM.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composed)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "composedPath", + "value": "() => EventTarget[]", + "description": "The **`composedPath()`** method of the Event interface returns the event's path which is an array of the objects on which listeners will be invoked.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/composedPath)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "accessory", - "value": "HTMLElement", - "description": "Additional interactive content displayed within the text field.\n\nAccepts button and clickable components with text content only. Other component types or complex layouts are not supported.", - "isOptional": true - } - ], - "value": "export interface TextFieldSlots {\n /**\n * Additional interactive content displayed within the text field.\n *\n * Accepts button and clickable components with text content only. Other component types or complex layouts are not supported.\n */\n accessory?: HTMLElement;\n}" - } - }, - "ThumbnailEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "ThumbnailEvents", - "description": "The thumbnail component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "currentTarget", + "value": "EventTarget | null", + "description": "The **`currentTarget`** read-only property of the Event interface identifies the element to which the event handler has been attached.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/currentTarget)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "defaultPrevented", + "value": "boolean", + "description": "The **`defaultPrevented`** read-only property of the Event interface returns a boolean value indicating whether or not the call to Event.preventDefault() canceled the event.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/defaultPrevented)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", "name": "error", - "value": "OnErrorEventHandler", - "description": "A callback fired when the thumbnail image fails to load.\n\nLearn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event)." + "value": "AggregateError$1", + "description": "The **`error`** read-only property of the ErrorEvent interface returns a JavaScript value, such as an Error or DOMException, representing the error associated with this event.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/error)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "load", - "value": "CallbackEventListener | null", - "description": "A callback fired when the thumbnail image successfully loads.\n\nLearn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event)." - } - ], - "value": "export interface ThumbnailEvents {\n /**\n * A callback fired when the thumbnail image successfully loads.\n *\n * Learn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/load_event).\n */\n load: CallbackEventListener | null = null;\n /**\n * A callback fired when the thumbnail image fails to load.\n *\n * Learn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/error_event).\n */\n error: OnErrorEventHandler = null;\n}" - } - }, - "TooltipSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "TooltipSlots", - "description": "The tooltip component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "eventPhase", + "value": "number", + "description": "The **`eventPhase`** read-only property of the being evaluated.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/eventPhase)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The informational text or elements displayed within the tooltip overlay, providing helpful context or explanations when users interact with the associated element.\n\nOnly accepts text, paragraph components, and raw `textContent`.", - "isOptional": true - } - ], - "value": "export interface TooltipSlots {\n /**\n * The informational text or elements displayed within the tooltip overlay, providing helpful context or explanations when users interact with the associated element.\n *\n * Only accepts text, paragraph components, and raw `textContent`.\n */\n children?: HTMLElement;\n}" - } - }, - "URLFieldEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "URLFieldEvents", - "description": "The URL field component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "filename", + "value": "string", + "description": "The **`filename`** read-only property of the ErrorEvent interface returns a string containing the name of the script file in which the error occurred.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/filename)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "initEvent", + "value": "(type: string, bubbles?: boolean, cancelable?: boolean) => void", + "description": "The **`Event.initEvent()`** method is used to initialize the value of an event created using Document.createEvent().", + "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/initEvent)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "blur", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the URL field loses focus.\n\nLearn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event)." + "name": "isTrusted", + "value": "boolean", + "description": "The **`isTrusted`** read-only property of the when the event was generated by the user agent (including via user actions and programmatic methods such as HTMLElement.focus()), and `false` when the event was dispatched via The only exception is the `click` event, which initializes the `isTrusted` property to `false` in user agents.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/isTrusted)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "change", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the URL field value changes.\n\nLearn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)." + "name": "lineno", + "value": "number", + "description": "The **`lineno`** read-only property of the ErrorEvent interface returns an integer containing the line number of the script file on which the error occurred.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/lineno)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "focus", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the URL field receives focus.\n\nLearn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event)." + "name": "message", + "value": "string", + "description": "The **`message`** read-only property of the ErrorEvent interface returns a string containing a human-readable error message describing the problem.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/ErrorEvent/message)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "input", - "value": "CallbackEventListener<'input'>", - "description": "A callback fired when the user inputs data into the URL field.\n\nLearn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event)." - } - ], - "value": "export interface URLFieldEvents {\n /**\n * A callback fired when the URL field value changes.\n *\n * Learn more about the [change event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event).\n */\n change: CallbackEventListener<'input'>;\n /**\n * A callback fired when the user inputs data into the URL field.\n *\n * Learn more about the [input event](https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event).\n */\n input: CallbackEventListener<'input'>;\n /**\n * A callback fired when the URL field loses focus.\n *\n * Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event).\n */\n blur: CallbackEventListener<'input'>;\n /**\n * A callback fired when the URL field receives focus.\n *\n * Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event).\n */\n focus: CallbackEventListener<'input'>;\n}" - } - }, - "UnorderedListSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "UnorderedListSlots", - "description": "The unordered list component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "NONE", + "value": "0", + "description": "" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "preventDefault", + "value": "() => void", + "description": "The **`preventDefault()`** method of the Event interface tells the user agent that if the event does not get explicitly handled, its default action should not be taken as it normally would be.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/preventDefault)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "children", - "value": "HTMLElement", - "description": "The list entries displayed within the unordered list, where each item is marked with a bullet point. Only accepts list item components as children. Each list item represents a single bulleted entry in the list.", - "isOptional": true - } - ], - "value": "export interface UnorderedListSlots {\n /**\n * The list entries displayed within the unordered list, where each item is marked with a bullet point. Only accepts list item components as children. Each list item represents a single bulleted entry in the list.\n */\n children?: HTMLElement;\n}" - } - }, - "AdminActionSlots": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "AdminActionSlots", - "description": "The admin action component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots).", - "isPublicDocs": true, - "members": [ + "name": "returnValue", + "value": "boolean", + "description": "The Event property **`returnValue`** indicates whether the default action for this event has been prevented or not.", + "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/returnValue)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "primary-action", - "value": "HTMLElement", - "description": "The main action button or link displayed in the admin action modal. This represents the primary or most important action that users can take in this modal context, typically displayed with high visual prominence." + "name": "srcElement", + "value": "EventTarget | null", + "description": "The deprecated **`Event.srcElement`** is an alias for the Event.target property.", + "deprecationMessage": "[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/srcElement)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "stopImmediatePropagation", + "value": "() => void", + "description": "The **`stopImmediatePropagation()`** method of the If several listeners are attached to the same element for the same event type, they are called in the order in which they were added.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopImmediatePropagation)" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "MethodSignature", + "name": "stopPropagation", + "value": "() => void", + "description": "The **`stopPropagation()`** method of the Event interface prevents further propagation of the current event in the capturing and bubbling phases.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/stopPropagation)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "secondary-actions", - "value": "HTMLElement", - "description": "Additional action buttons or links displayed in the admin action modal. These provide alternative or supporting actions, visually de-emphasized compared to the primary action to establish clear hierarchy." - } - ], - "value": "export interface AdminActionSlots {\n /**\n * The main action button or link displayed in the admin action modal.\n * This represents the primary or most important action that users can take in this modal context, typically displayed with high visual prominence.\n */\n 'primary-action': HTMLElement;\n /**\n * Additional action buttons or links displayed in the admin action modal.\n * These provide alternative or supporting actions, visually de-emphasized compared to the primary action to establish clear hierarchy.\n */\n 'secondary-actions': HTMLElement;\n}" - } - }, - "FormEvents": { - "src/surfaces/admin/components.ts": { - "filePath": "src/surfaces/admin/components.ts", - "name": "FormEvents", - "description": "The form component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, - "members": [ + "name": "target", + "value": "EventTarget | null", + "description": "The read-only **`target`** property of the dispatched.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/target)" + }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "reset", - "value": "CallbackEventListener | null", - "description": "A callback that is run when the form is reset." + "name": "timeStamp", + "value": "DOMHighResTimeStamp", + "description": "The **`timeStamp`** read-only property of the Event interface returns the time (in milliseconds) at which the event was created.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/timeStamp)" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "submit", - "value": "CallbackExtendableEventListener | null", - "description": "A callback that is run when the form is submitted." + "name": "type", + "value": "string", + "description": "The **`type`** read-only property of the Event interface returns a string containing the event's type.\n\n[MDN Reference](https://developer.mozilla.org/docs/Web/API/Event/type)" } ], - "value": "export interface FormEvents {\n /**\n * A callback that is run when the form is submitted.\n */\n submit: CallbackExtendableEventListener | null = null;\n /**\n * A callback that is run when the form is reset.\n */\n reset: CallbackEventListener | null = null;\n}" + "value": "export interface AggregateErrorEvent extends ErrorEvent {\n error: AggregateError$1;\n}" } }, - "FunctionSettingsEvents": { + "FunctionSettingsError": { "src/surfaces/admin/components.ts": { "filePath": "src/surfaces/admin/components.ts", - "name": "FunctionSettingsEvents", - "description": "The function settings component provides event callbacks for handling user interactions. Learn more about [handling events](/docs/api/polaris/using-polaris-web-components#handling-events).", - "isPublicDocs": true, + "name": "FunctionSettingsError", + "description": "", "members": [ { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "error", - "value": "CallbackErrorEventListener<\n typeof tagName,\n FunctionSettingsErrorEvent['error']['errors'][0]\n > | null", - "description": "An optional callback function that will be run by the admin when committing the changes to Shopify’s servers fails. The error event you receive includes an `error` property that is an `AggregateError` object. This object includes an array of errors that were caused by data your extension provided. Network errors and user errors that are out of your control will not be reported here.\n\nIn the `onError` callback, you should update your extension’s UI to highlight the fields that caused the errors, and display the error messages to the user." + "name": "code", + "value": "string", + "description": "A unique identifier describing the “class” of error. These will match the GraphQL error codes as closely as possible. For example the enums returned by the `metafieldsSet` mutation" + }, + { + "filePath": "src/surfaces/admin/components.ts", + "syntaxKind": "PropertySignature", + "name": "message", + "value": "string", + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "reset", - "value": "CallbackEventListener | null", - "description": "A callback that is run when the function settings form is reset." + "name": "name", + "value": "'FunctionSettingsError'", + "description": "" }, { "filePath": "src/surfaces/admin/components.ts", "syntaxKind": "PropertySignature", - "name": "submit", - "value": "CallbackExtendableEventListener | null", - "description": "An optional callback function that will be run by the admin when the user commits their changes in the admin-rendered part of the function settings experience. If `event.waitUntil` is called with a promise, the admin will wait for the promise to resolve before committing any changes to Shopify’s servers. If the promise rejects, the admin will abort the changes and display an error, using the `message` property of the error you reject with." + "name": "stack", + "value": "string", + "description": "", + "isOptional": true } ], - "value": "export interface FunctionSettingsEvents {\n /**\n * An optional callback function that will be run by the admin when the user\n * commits their changes in the admin-rendered part of the function settings\n * experience. If `event.waitUntil` is called with a promise, the admin will wait for the\n * promise to resolve before committing any changes to Shopify’s servers. If\n * the promise rejects, the admin will abort the changes and display an error,\n * using the `message` property of the error you reject with.\n */\n submit: CallbackExtendableEventListener | null = null;\n /**\n * An optional callback function that will be run by the admin when\n * committing the changes to Shopify’s servers fails. The error event you receive includes\n * an `error` property that is an `AggregateError` object. This object includes\n * an array of errors that were caused by data your extension provided.\n * Network errors and user errors that are out of your control will not be reported here.\n *\n * In the `onError` callback, you should update your extension’s UI to\n * highlight the fields that caused the errors, and display the error messages\n * to the user.\n */\n error: CallbackErrorEventListener<\n typeof tagName,\n FunctionSettingsErrorEvent['error']['errors'][0]\n > | null = null;\n /**\n * A callback that is run when the function settings form is reset.\n */\n reset: CallbackEventListener | null = null;\n}" + "value": "export interface FunctionSettingsError extends Error {\n /**\n * A unique identifier describing the “class” of error. These will match\n * the GraphQL error codes as closely as possible. For example the enums\n * returned by the `metafieldsSet` mutation\n *\n * @see https://shopify.dev/docs/api/admin-graphql/latest/enums/MetafieldsSetUserErrorCode\n */\n code: string;\n name: 'FunctionSettingsError';\n}" } }, "DataGeneratedType": { diff --git a/packages/ui-extensions/src/surfaces/admin/components.d.ts b/packages/ui-extensions/src/surfaces/admin/components.d.ts index 8dc7f2f26f..6074243828 100644 --- a/packages/ui-extensions/src/surfaces/admin/components.d.ts +++ b/packages/ui-extensions/src/surfaces/admin/components.d.ts @@ -1,4 +1,4 @@ -/** VERSION: 1.25.0 **/ +/** VERSION: 1.64.0 **/ /* eslint-disable @typescript-eslint/ban-types */ /* eslint-disable @typescript-eslint/no-namespace */ @@ -10,51 +10,36 @@ * TODO: Update `any` type here after this is resolved * https://github.com/Shopify/ui-api-design/issues/139 */ -/** - * Represents any valid children that can be rendered within a component, including elements, strings, numbers, or arrays of these types. - * This is an alias for Preact's `ComponentChildren` type. - * @publicDocs - */ +import * as _shopify_admin_web_component_foundations from '@shopify/admin-web-component-foundations'; + export type ComponentChildren = preact.ComponentChildren; -/** - * Represents string-only children for components that specifically require text content. - * @publicDocs - */ export type StringChildren = string; export interface GlobalProps { /** - * A unique identifier for the element. Use this to reference the element in JavaScript, - * link labels to form controls, or target specific elements for styling or scripting. + * A unique identifier for the element. */ id?: string; } -/** @publicDocs */ export interface ActionProps { /** - * The text to use as the action modal's title. If not provided, the name of the extension will be used. + * The text to use as the Action modal’s title. If not provided, the name of the extension will be used. */ heading?: string; } -/** - * The action component supports slots for additional content placement within the component. Learn more about [using slots](/docs/api/polaris/using-polaris-web-components#slots). - * @publicDocs - */ export interface ActionSlots { /** - * The primary action button or link, representing the main or most important action available in this context. - * Typically displayed with higher visual prominence than secondary actions to establish clear hierarchy. + * The primary action to perform, provided as a button or link type element. */ primaryAction?: ComponentChildren; /** - * Additional action buttons or links that provide alternative or supporting actions. - * Visually de-emphasized compared to the primary action. + * The secondary actions to perform, provided as button or link type elements. */ secondaryActions?: ComponentChildren; } interface AdminActionProps$1 extends GlobalProps, ActionProps, ActionSlots { /** - * Whether the action is in a loading state, such as during initial page load or when the action is being opened. - * When `true`, the action is in an inert state that prevents user interaction. + * Whether the action is in a loading state, such as initial page load or action opening. + * When true, the action could be in an inert state, which prevents user interaction. * * @default false */ @@ -62,161 +47,140 @@ interface AdminActionProps$1 extends GlobalProps, ActionProps, ActionSlots { } interface AdminBlockProps$1 extends GlobalProps { /** - * The text displayed as the block's title in the header. If not provided, the extension name will be used. + * The text to use as the Block title in the block header. If not provided, the name of the + * extension will be used. */ heading?: string; /** - * The summary text displayed when the app block is collapsed. Summaries longer than 30 characters will be truncated. + * The summary to display when the app block is collapsed. + * Summary longer than 30 characters will be truncated. */ collapsedSummary?: string; } interface AdminPrintActionProps$1 extends GlobalProps { /** - * The URL of the document to preview and print. Supports HTML, PDF, and image formats. + * Sets the src URL of the preview and the document to print. * If not provided, the preview will show an empty state and the print button will be disabled. + * HTML, PDFs and images are supported. */ src?: string; + /** + * Programmatically controls the loading state of the component. + * When true, displays a loading indicator. The component also shows loading automatically when fetching the preview. + * + * @default false + */ + loading?: boolean; } -/** @publicDocs */ export interface BaseOverlayProps { /** - * A callback fired immediately after the overlay is shown. + * Callback fired after the overlay is shown. */ onShow?: (event: Event) => void; /** - * A callback fired when the overlay is shown, after any show animations have completed. + * Callback fired when the overlay is shown **after** any animations to show the overlay have finished. */ onAfterShow?: (event: Event) => void; /** - * A callback fired immediately after the overlay is hidden. + * Callback fired after the overlay is hidden. */ onHide?: (event: Event) => void; /** - * A callback fired when the overlay is hidden, after any hide animations have completed. + * Callback fired when the overlay is hidden **after** any animations to hide the overlay have finished. */ onAfterHide?: (event: Event) => void; } /** - * Shared interface for web component methods that control overlay visibility. + * Shared interfaces for web component methods. * - * All methods are required (not optional) because components implementing this interface must provide - * consistent JavaScript APIs. Unlike props/attributes, methods are not rendered in HTML and consumers - * expect them to be available on all component instances. - * @publicDocs + * Methods are required (not optional) because: + * - Components implementing this interface must provide all methods + * - Unlike props/attributes, methods are not rendered in HTML but are JavaScript APIs + * - Consumers expect these methods to be consistently available on all instances */ export interface BaseOverlayMethods { /** - * A method to programmatically show the overlay. + * Method to show an overlay. * * @implementation This is a method to be called on the element and not a callback and should hence be camelCase */ showOverlay: () => void; /** - * A method to programmatically hide the overlay. + * Method to hide an overlay. * * @implementation This is a method to be called on the element and not a callback and should hence be camelCase */ hideOverlay: () => void; /** - * A method to programmatically toggle the visibility of the overlay. + * Method to toggle the visiblity of an overlay. * * @implementation This is a method to be called on the element and not a callback and should hence be camelCase */ toggleOverlay: () => void; } -/** @publicDocs */ export interface FocusEventProps { /** - * A callback fired when the component loses focus. Learn more about the [blur event](https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event). + * Callback when the element loses focus. + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event */ onBlur?: (event: FocusEvent) => void; /** - * A callback fired when the component receives focus. Learn more about the [focus event](https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event). + * Callback when the element receives focus. + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/Element/focus_event */ onFocus?: (event: FocusEvent) => void; } -/** @publicDocs */ export interface ToggleEventProps { /** - * A callback fired when the element state changes, after any toggle animations have finished. + * Callback fired when the element state changes **after** any animations have finished. * * - If the element transitioned from hidden to showing, the `oldState` property will be set to `closed` and the * `newState` property will be set to `open`. * - If the element transitioned from showing to hidden, the `oldState` property will be set to `open` and the * `newState` will be `closed`. * - * Learn more about [ToggleEvent.newState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/newState) and [ToggleEvent.oldState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/oldState). + * @see https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/newState + * @see https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/oldState */ onAfterToggle?: (event: ToggleEvent$1) => void; /** - * A callback fired immediately when the element state changes, before any animations. + * Callback straight after the element state changes. * * - If the element is transitioning from hidden to showing, the `oldState` property will be set to `closed` and the * `newState` property will be set to `open`. * - If the element is transitioning from showing to hidden, then `oldState` property will be set to `open` and the * `newState` will be `closed`. * - * Learn more about the [toggle event](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event), [ToggleEvent.newState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/newState), and [ToggleEvent.oldState](https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/oldState). + * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event + * @see https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/newState + * @see https://developer.mozilla.org/en-US/docs/Web/API/ToggleEvent/oldState */ onToggle?: (event: ToggleEvent$1) => void; } -/** - * Represents the visibility state of a toggleable element. - * - * - `open`: The element is visible or expanded. - * - `closed`: The element is hidden or collapsed. - * @publicDocs - */ export type ToggleState = 'open' | 'closed'; interface ToggleEvent$1 extends Event { - /** - * The state the element is transitioning to, either `open` or `closed`. - */ readonly newState: ToggleState; - /** - * The state the element is transitioning from, either `open` or `closed`. - */ readonly oldState: ToggleState; } -/** @publicDocs */ export interface ExtendableEvent extends Event { /** - * A method that accepts a promise signaling the duration and eventual success or failure of event-related actions. + * Provide a promise that signals the length, and eventual success or failure of actions relating to the event. + * + * This may be called many times, which adds promises to the event. * - * Can be called multiple times to add promises to the event, but must be called synchronously during event dispatch. - * Cannot be called after a `setTimeout` or within a microtask. + * However, this may only be called synchronously during the dispatch of the event. + * As in, you cannot call it after a `setTimeout` or microtask. */ waitUntil?: (promise: Promise) => void; } -/** @publicDocs */ -export interface AggregateError extends Error { - /** - * An array of individual errors that have been aggregated together. - * Each error in this array represents a separate failure that occurred. - */ +interface AggregateError$1 extends Error { errors: T[]; } -/** @publicDocs */ export interface AggregateErrorEvent extends ErrorEvent { - /** - * The aggregated error object containing multiple individual errors. - * Access the `errors` property to retrieve the array of individual error instances. - */ - error: AggregateError; + error: AggregateError$1; } -/** - * Defines component sizes using a consistent scale from extra small to extra large. - * - * - `small-500` through `small-100`: Extra small to small sizes, progressively increasing. - * - `small`: Standard small size. - * - `base`: Default medium size that works well in most contexts. - * - `large`: Standard large size. - * - `large-100` through `large-500`: Large to extra large sizes, progressively increasing. - * - * - * @default 'base' - * @publicDocs - */ export type SizeKeyword = | 'small-500' | 'small-400' @@ -231,774 +195,691 @@ export type SizeKeyword = | 'large-300' | 'large-400' | 'large-500'; -/** - * Defines the color intensity or emphasis level for text and UI elements. - * - * - `subdued`: Deemphasized color for secondary text, supporting labels, and less critical interface elements. - * - `base`: Primary color for body text, standard UI elements, and general content with good readability. - * - `strong`: Emphasized color for headings, key labels, and interactive elements that need prominence. - * - * @publicDocs - */ export type ColorKeyword = 'subdued' | 'base' | 'strong'; interface AvatarProps$1 extends GlobalProps { /** - * The initials to display in the avatar when no image is provided or fails to load. - * Typically one or two characters representing a person's first and last name initials, such as "JD" for John Doe. + * Initials to display in the avatar. */ initials?: string; /** - * The URL or path to the avatar image. When provided, the image takes priority over `initials`. - * If the image fails to load or loads slowly, `initials` will be rendered as a fallback. + * The URL or path to the image. + * + * Initials will be rendered as a fallback if `src` is not provided, fails to load or does not load quickly */ src?: string; /** - * A callback fired when the avatar image loads successfully. Learn more about the [load event](https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onload). + * Invoked when load of provided image completes successfully. + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onload */ onLoad?: (event: Event) => void; /** - * A callback fired when the avatar image fails to load. Learn more about the [error event](https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onerror). + * Invoked on load error of provided image. + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onerror */ onError?: (event: Event) => void; /** - * The size of the avatar. Available sizes range from `small-500` (smallest) to `large-500` (largest), with `base` providing the default medium size that works well in most contexts. + * Size of the avatar. * * @default 'base' */ size?: SizeKeyword; /** - * Alternative text that describes the avatar for accessibility. - * - * Provides a text description of the avatar for users with assistive technology - * and serves as a fallback when the avatar fails to load. A well-written description - * enables people with visual impairments to understand non-text content. - * - * When a screen reader encounters an avatar, it reads this description aloud. - * When an avatar fails to load, this text displays on screen, helping all users - * understand what content was intended. - * - * Learn more about [writing effective alt text](https://www.shopify.com/ca/blog/image-alt-text#4) - * and the [alt attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#alt). + * An alternative text that describes the avatar for the reader + * to understand what it is about or identify the user the avatar belongs to. */ alt?: string; } -/** - * Defines the background color intensity or emphasis level for UI elements. - * - * - `transparent`: No background, allowing the underlying surface to show through. - * - `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment. - * - * @publicDocs - */ export type BackgroundColorKeyword = 'transparent' | ColorKeyword; export interface BackgroundProps { /** - * The background color of the element. Use `transparent` for no background, `subdued` for a subtle background, `base` for standard background, or `strong` for a prominent background. - * - * - `transparent`: No background, allowing the underlying surface to show through. - * - `ColorKeyword`: Applies color intensity levels (subdued, base, strong) to create spatial emphasis and containment. + * Adjust the background of the element. * * @default 'transparent' */ background?: BackgroundColorKeyword; } /** - * Defines the semantic color treatment of a component to convey specific intent or status. - * - * Tones apply coordinated color schemes (text, background, icons) across the component. - * Some components, like banner, also use tone to determine accessibility attributes and screen reader announcements. - * - * - `auto`: Automatically determined based on context. - * - `neutral`: General-purpose information without specific sentiment. - * - `info`: Informational content that provides helpful details or guidance. - * - `success`: Positive outcomes, successful operations, or confirmations. - * - `caution`: Warnings about potential issues that require attention but aren't critical. - * - `warning`: Similar to caution, indicates something that needs user awareness. - * - `critical`: Errors, failures, or urgent issues that require immediate attention. - * - `accent`: Highlighted or emphasized content that doesn't fit other semantic tones. - * - `custom`: Custom color treatment defined by your theme or implementation. - * - * @default 'auto' - * @publicDocs - */ -export type ToneKeyword = - | 'auto' - | 'neutral' - | 'info' - | 'success' - | 'caution' - | 'warning' - | 'critical' - | 'accent' - | 'custom'; -declare const privateIconArray: readonly [ - 'adjust', - 'affiliate', - 'airplane', - 'alert-bubble', - 'alert-circle', - 'alert-diamond', - 'alert-location', - 'alert-octagon', - 'alert-octagon-filled', - 'alert-triangle', - 'alert-triangle-filled', - 'app-extension', - 'apps', - 'archive', - 'arrow-down', - 'arrow-down-circle', - 'arrow-down-right', - 'arrow-left', - 'arrow-left-circle', - 'arrow-right', - 'arrow-right-circle', - 'arrow-up', - 'arrow-up-circle', - 'arrow-up-right', - 'arrows-in-horizontal', - 'arrows-out-horizontal', - 'asterisk', - 'attachment', - 'automation', - 'backspace', - 'bag', - 'bank', - 'barcode', - 'battery-low', - 'bill', - 'blank', - 'blog', - 'bolt', - 'bolt-filled', - 'book', - 'book-open', - 'bug', - 'bullet', - 'business-entity', - 'button', - 'button-press', - 'calculator', - 'calendar', - 'calendar-check', - 'calendar-compare', - 'calendar-list', - 'calendar-time', - 'camera', - 'camera-flip', - 'caret-down', - 'caret-left', - 'caret-right', - 'caret-up', - 'cart', - 'cart-abandoned', - 'cart-discount', - 'cart-down', - 'cart-filled', - 'cart-sale', - 'cart-send', - 'cart-up', - 'cash-dollar', - 'cash-euro', - 'cash-pound', - 'cash-rupee', - 'cash-yen', - 'catalog-product', - 'categories', - 'channels', - 'chart-cohort', - 'chart-donut', - 'chart-funnel', - 'chart-histogram-first', - 'chart-histogram-first-last', - 'chart-histogram-flat', - 'chart-histogram-full', - 'chart-histogram-growth', - 'chart-histogram-last', - 'chart-histogram-second-last', - 'chart-horizontal', - 'chart-line', - 'chart-popular', - 'chart-stacked', - 'chart-vertical', - 'chat', - 'chat-new', - 'chat-referral', - 'check', - 'check-circle', - 'check-circle-filled', - 'checkbox', - 'chevron-down', - 'chevron-down-circle', - 'chevron-left', - 'chevron-left-circle', - 'chevron-right', - 'chevron-right-circle', - 'chevron-up', - 'chevron-up-circle', - 'circle', - 'circle-dashed', - 'clipboard', - 'clipboard-check', - 'clipboard-checklist', - 'clock', - 'clock-list', - 'clock-revert', - 'code', - 'code-add', - 'collection', - 'collection-featured', - 'collection-list', - 'collection-reference', - 'color', - 'color-none', - 'compass', - 'complete', - 'compose', - 'confetti', - 'connect', - 'content', - 'contract', - 'corner-pill', - 'corner-round', - 'corner-square', - 'credit-card', - 'credit-card-cancel', - 'credit-card-percent', - 'credit-card-reader', - 'credit-card-reader-chip', - 'credit-card-reader-tap', - 'credit-card-secure', - 'credit-card-tap-chip', - 'crop', - 'currency-convert', - 'cursor', - 'cursor-banner', - 'cursor-option', - 'data-presentation', - 'data-table', - 'database', - 'database-add', - 'database-connect', - 'delete', - 'delivered', - 'delivery', - 'desktop', - 'disabled', - 'disabled-filled', - 'discount', - 'discount-add', - 'discount-automatic', - 'discount-code', - 'discount-remove', - 'dns-settings', - 'dock-floating', - 'dock-side', - 'domain', - 'domain-landing-page', - 'domain-new', - 'domain-redirect', - 'download', - 'drag-drop', - 'drag-handle', - 'drawer', - 'duplicate', - 'edit', - 'email', - 'email-follow-up', - 'email-newsletter', - 'empty', - 'enabled', - 'enter', - 'envelope', - 'envelope-soft-pack', - 'eraser', - 'exchange', - 'exit', - 'export', - 'external', - 'eye-check-mark', - 'eye-dropper', - 'eye-dropper-list', - 'eye-first', - 'eyeglasses', - 'fav', - 'favicon', - 'file', - 'file-list', - 'filter', - 'filter-active', - 'flag', - 'flip-horizontal', - 'flip-vertical', - 'flower', - 'folder', - 'folder-add', - 'folder-down', - 'folder-remove', - 'folder-up', - 'food', - 'foreground', - 'forklift', - 'forms', - 'games', - 'gauge', - 'geolocation', - 'gift', - 'gift-card', - 'git-branch', - 'git-commit', - 'git-repository', - 'globe', - 'globe-asia', - 'globe-europe', - 'globe-lines', - 'globe-list', - 'graduation-hat', - 'grid', - 'hashtag', - 'hashtag-decimal', - 'hashtag-list', - 'heart', - 'hide', - 'hide-filled', - 'home', - 'home-filled', - 'icons', - 'identity-card', - 'image', - 'image-add', - 'image-alt', - 'image-explore', - 'image-magic', - 'image-none', - 'image-with-text-overlay', - 'images', - 'import', - 'in-progress', - 'incentive', - 'incoming', - 'incomplete', - 'info', - 'info-filled', - 'inheritance', - 'inventory', - 'inventory-edit', - 'inventory-list', - 'inventory-transfer', - 'inventory-updated', - 'iq', - 'key', - 'keyboard', - 'keyboard-filled', - 'keyboard-hide', - 'keypad', - 'label-printer', - 'language', - 'language-translate', - 'layout-block', - 'layout-buy-button', - 'layout-buy-button-horizontal', - 'layout-buy-button-vertical', - 'layout-column-1', - 'layout-columns-2', - 'layout-columns-3', - 'layout-footer', - 'layout-header', - 'layout-logo-block', - 'layout-popup', - 'layout-rows-2', - 'layout-section', - 'layout-sidebar-left', - 'layout-sidebar-right', - 'lightbulb', - 'link', - 'link-list', - 'list-bulleted', - 'list-bulleted-filled', - 'list-numbered', - 'live', - 'live-critical', - 'live-none', - 'location', - 'location-none', - 'lock', - 'map', - 'markets', - 'markets-euro', - 'markets-rupee', - 'markets-yen', - 'maximize', - 'measurement-size', - 'measurement-size-list', - 'measurement-volume', - 'measurement-volume-list', - 'measurement-weight', - 'measurement-weight-list', - 'media-receiver', - 'megaphone', - 'mention', - 'menu', - 'menu-filled', - 'menu-horizontal', - 'menu-vertical', - 'merge', - 'metafields', - 'metaobject', - 'metaobject-list', - 'metaobject-reference', - 'microphone', - 'microphone-muted', - 'minimize', - 'minus', - 'minus-circle', - 'mobile', - 'money', - 'money-none', - 'money-split', - 'moon', - 'nature', - 'note', - 'note-add', - 'notification', - 'number-one', - 'order', - 'order-batches', - 'order-draft', - 'order-filled', - 'order-first', - 'order-fulfilled', - 'order-repeat', - 'order-unfulfilled', - 'orders-status', - 'organization', - 'outdent', - 'outgoing', - 'package', - 'package-cancel', - 'package-fulfilled', - 'package-on-hold', - 'package-reassign', - 'package-returned', - 'page', - 'page-add', - 'page-attachment', - 'page-clock', - 'page-down', - 'page-heart', - 'page-list', - 'page-reference', - 'page-remove', - 'page-report', - 'page-up', - 'pagination-end', - 'pagination-start', - 'paint-brush-flat', - 'paint-brush-round', - 'paper-check', - 'partially-complete', - 'passkey', - 'paste', - 'pause-circle', - 'payment', - 'payment-capture', - 'payout', - 'payout-dollar', - 'payout-euro', - 'payout-pound', - 'payout-rupee', - 'payout-yen', - 'person', - 'person-add', - 'person-exit', - 'person-filled', - 'person-list', - 'person-lock', - 'person-remove', - 'person-segment', - 'personalized-text', - 'phablet', - 'phone', - 'phone-down', - 'phone-down-filled', - 'phone-in', - 'phone-out', - 'pin', - 'pin-remove', - 'plan', - 'play', - 'play-circle', - 'plus', - 'plus-circle', - 'plus-circle-down', - 'plus-circle-filled', - 'plus-circle-up', - 'point-of-sale', - 'point-of-sale-register', - 'price-list', - 'print', - 'product', - 'product-add', - 'product-cost', - 'product-filled', - 'product-list', - 'product-reference', - 'product-remove', - 'product-return', - 'product-unavailable', - 'profile', - 'profile-filled', - 'question-circle', - 'question-circle-filled', - 'radio-control', - 'receipt', - 'receipt-dollar', - 'receipt-euro', - 'receipt-folded', - 'receipt-paid', - 'receipt-pound', - 'receipt-refund', - 'receipt-rupee', - 'receipt-yen', - 'receivables', - 'redo', - 'referral-code', - 'refresh', - 'remove-background', - 'reorder', - 'replace', - 'replay', - 'reset', - 'return', - 'reward', - 'rocket', - 'rotate-left', - 'rotate-right', - 'sandbox', - 'save', - 'savings', - 'scan-qr-code', - 'search', - 'search-add', - 'search-list', - 'search-recent', - 'search-resource', - 'select', - 'send', - 'settings', - 'share', - 'shield-check-mark', - 'shield-none', - 'shield-pending', - 'shield-person', - 'shipping-label', - 'shipping-label-cancel', - 'shopcodes', - 'slideshow', - 'smiley-happy', - 'smiley-joy', - 'smiley-neutral', - 'smiley-sad', - 'social-ad', - 'social-post', - 'sort', - 'sort-ascending', - 'sort-descending', - 'sound', - 'split', - 'sports', - 'star', - 'star-circle', - 'star-filled', - 'star-half', - 'star-list', - 'status', - 'status-active', - 'stop-circle', - 'store', - 'store-import', - 'store-managed', - 'store-online', - 'sun', - 'table', - 'table-masonry', - 'tablet', - 'target', - 'tax', - 'team', - 'text', - 'text-align-center', - 'text-align-left', - 'text-align-right', - 'text-block', - 'text-bold', - 'text-color', - 'text-font', - 'text-font-list', - 'text-grammar', - 'text-in-columns', - 'text-in-rows', - 'text-indent', - 'text-indent-remove', - 'text-italic', - 'text-quote', - 'text-title', - 'text-underline', - 'text-with-image', - 'theme', - 'theme-edit', - 'theme-store', - 'theme-template', - 'three-d-environment', - 'thumbs-down', - 'thumbs-up', - 'tip-jar', - 'toggle-off', - 'toggle-on', - 'transaction', - 'transaction-fee-add', - 'transaction-fee-dollar', - 'transaction-fee-euro', - 'transaction-fee-pound', - 'transaction-fee-rupee', - 'transaction-fee-yen', - 'transfer', - 'transfer-in', - 'transfer-internal', - 'transfer-out', - 'truck', - 'undo', - 'unknown-device', - 'unlock', - 'upload', - 'variant', - 'variant-list', - 'video', - 'video-list', - 'view', - 'viewport-narrow', - 'viewport-short', - 'viewport-tall', - 'viewport-wide', - 'wallet', - 'wand', - 'watch', - 'wifi', - 'work', - 'work-list', - 'wrench', - 'x', - 'x-circle', - 'x-circle-filled', -]; -/** - * Represents the available icon names that can be used in icon components. - * This is derived from the complete list of supported icons in the design system. - * @publicDocs - */ -export type IconType = (typeof privateIconArray)[number]; -/** - * A type-safe version of TypeScript's `Extract` utility that constrains the second type parameter - * to be assignable to the first. This provides compile-time validation that you're only extracting - * types that actually exist within the union, catching potential errors earlier in development. - * - * @publicDocs + * Tone is a property for defining the color treatment of a component. + * + * A tone can apply a grouping of colors to a component. For example, + * critical may have a specific text color and background color. + * + * In some cases, like for Banner, the tone may also affect the semantic and accessibility treatment of the component. + * + * @default 'auto' + */ +export type ToneKeyword = + | 'auto' + | 'neutral' + | 'info' + | 'success' + | 'caution' + | 'warning' + | 'critical' + | 'accent' + | 'custom'; +export type IconType = + | 'adjust' + | 'affiliate' + | 'airplane' + | 'alert-bubble' + | 'alert-circle' + | 'alert-diamond' + | 'alert-location' + | 'alert-octagon' + | 'alert-octagon-filled' + | 'alert-triangle' + | 'alert-triangle-filled' + | 'align-horizontal-centers' + | 'app-extension' + | 'apps' + | 'archive' + | 'arrow-down' + | 'arrow-down-circle' + | 'arrow-down-right' + | 'arrow-left' + | 'arrow-left-circle' + | 'arrow-right' + | 'arrow-right-circle' + | 'arrow-up' + | 'arrow-up-circle' + | 'arrow-up-right' + | 'arrows-in-horizontal' + | 'arrows-out-horizontal' + | 'asterisk' + | 'attachment' + | 'automation' + | 'backspace' + | 'bag' + | 'bank' + | 'barcode' + | 'battery-low' + | 'bill' + | 'blank' + | 'blog' + | 'bolt' + | 'bolt-filled' + | 'book' + | 'book-open' + | 'brain' + | 'bug' + | 'bullet' + | 'business-entity' + | 'button' + | 'button-press' + | 'calculator' + | 'calendar' + | 'calendar-check' + | 'calendar-compare' + | 'calendar-list' + | 'calendar-time' + | 'camera' + | 'camera-flip' + | 'caret-down' + | 'caret-left' + | 'caret-right' + | 'caret-up' + | 'cart' + | 'cart-abandoned' + | 'cart-discount' + | 'cart-down' + | 'cart-filled' + | 'cart-sale' + | 'cart-send' + | 'cart-up' + | 'cash-dollar' + | 'cash-euro' + | 'cash-pound' + | 'cash-rupee' + | 'cash-yen' + | 'catalog-product' + | 'categories' + | 'channels' + | 'channels-filled' + | 'chart-cohort' + | 'chart-donut' + | 'chart-funnel' + | 'chart-histogram-first' + | 'chart-histogram-first-last' + | 'chart-histogram-flat' + | 'chart-histogram-full' + | 'chart-histogram-growth' + | 'chart-histogram-last' + | 'chart-histogram-second-last' + | 'chart-horizontal' + | 'chart-line' + | 'chart-popular' + | 'chart-stacked' + | 'chart-vertical' + | 'chat' + | 'chat-new' + | 'chat-referral' + | 'check' + | 'check-circle' + | 'check-circle-filled' + | 'checkbox' + | 'chevron-down' + | 'chevron-down-circle' + | 'chevron-left' + | 'chevron-left-circle' + | 'chevron-right' + | 'chevron-right-circle' + | 'chevron-up' + | 'chevron-up-circle' + | 'circle' + | 'circle-dashed' + | 'clipboard' + | 'clipboard-check' + | 'clipboard-checklist' + | 'clock' + | 'clock-list' + | 'clock-revert' + | 'code' + | 'code-add' + | 'collection' + | 'collection-featured' + | 'collection-list' + | 'collection-reference' + | 'color' + | 'color-none' + | 'compass' + | 'complete' + | 'compose' + | 'confetti' + | 'connect' + | 'content' + | 'contract' + | 'corner-pill' + | 'corner-round' + | 'corner-square' + | 'credit-card' + | 'credit-card-cancel' + | 'credit-card-percent' + | 'credit-card-reader' + | 'credit-card-reader-chip' + | 'credit-card-reader-tap' + | 'credit-card-secure' + | 'credit-card-tap-chip' + | 'crop' + | 'currency-convert' + | 'cursor' + | 'cursor-banner' + | 'cursor-option' + | 'data-presentation' + | 'data-table' + | 'database' + | 'database-add' + | 'database-connect' + | 'delete' + | 'delivered' + | 'delivery' + | 'desktop' + | 'disabled' + | 'disabled-filled' + | 'discount' + | 'discount-add' + | 'discount-automatic' + | 'discount-code' + | 'discount-remove' + | 'dns-settings' + | 'dock-floating' + | 'dock-side' + | 'domain' + | 'domain-landing-page' + | 'domain-new' + | 'domain-redirect' + | 'download' + | 'drag-drop' + | 'drag-handle' + | 'drawer' + | 'duplicate' + | 'edit' + | 'email' + | 'email-follow-up' + | 'email-newsletter' + | 'empty' + | 'enabled' + | 'enter' + | 'envelope' + | 'envelope-soft-pack' + | 'eraser' + | 'exchange' + | 'exit' + | 'export' + | 'external' + | 'eye-check-mark' + | 'eye-dropper' + | 'eye-dropper-list' + | 'eye-first' + | 'eyeglasses' + | 'fav' + | 'favicon' + | 'file' + | 'file-list' + | 'filter' + | 'filter-active' + | 'flag' + | 'flip-horizontal' + | 'flip-vertical' + | 'flower' + | 'folder' + | 'folder-add' + | 'folder-down' + | 'folder-remove' + | 'folder-up' + | 'food' + | 'foreground' + | 'forklift' + | 'forms' + | 'games' + | 'gauge' + | 'geolocation' + | 'gift' + | 'gift-card' + | 'git-branch' + | 'git-commit' + | 'git-repository' + | 'globe' + | 'globe-asia' + | 'globe-europe' + | 'globe-lines' + | 'globe-list' + | 'graduation-hat' + | 'grid' + | 'hashtag' + | 'hashtag-decimal' + | 'hashtag-list' + | 'heart' + | 'hide' + | 'hide-filled' + | 'home' + | 'home-filled' + | 'icons' + | 'identity-card' + | 'image' + | 'image-add' + | 'image-alt' + | 'image-explore' + | 'image-magic' + | 'image-none' + | 'image-with-text-overlay' + | 'images' + | 'import' + | 'in-progress' + | 'incentive' + | 'incoming' + | 'incomplete' + | 'info' + | 'info-filled' + | 'inheritance' + | 'inventory' + | 'inventory-edit' + | 'inventory-list' + | 'inventory-transfer' + | 'inventory-updated' + | 'iq' + | 'key' + | 'keyboard' + | 'keyboard-filled' + | 'keyboard-hide' + | 'keypad' + | 'label-printer' + | 'language' + | 'language-translate' + | 'layout-block' + | 'layout-buy-button' + | 'layout-buy-button-horizontal' + | 'layout-buy-button-vertical' + | 'layout-column-1' + | 'layout-columns-2' + | 'layout-columns-3' + | 'layout-footer' + | 'layout-header' + | 'layout-logo-block' + | 'layout-popup' + | 'layout-rows-2' + | 'layout-section' + | 'layout-sidebar-left' + | 'layout-sidebar-right' + | 'layer' + | 'lightbulb' + | 'link' + | 'link-list' + | 'list-bulleted' + | 'list-bulleted-filled' + | 'list-numbered' + | 'live' + | 'live-critical' + | 'live-none' + | 'location' + | 'location-none' + | 'lock' + | 'map' + | 'markets' + | 'markets-euro' + | 'markets-rupee' + | 'markets-yen' + | 'maximize' + | 'measurement-size' + | 'measurement-size-list' + | 'measurement-volume' + | 'measurement-volume-list' + | 'measurement-weight' + | 'measurement-weight-list' + | 'media-receiver' + | 'megaphone' + | 'mention' + | 'menu' + | 'menu-filled' + | 'menu-horizontal' + | 'menu-vertical' + | 'merge' + | 'metafields' + | 'metaobject' + | 'metaobject-list' + | 'metaobject-reference' + | 'microphone' + | 'microphone-muted' + | 'minimize' + | 'minus' + | 'minus-circle' + | 'mobile' + | 'money' + | 'money-none' + | 'money-split' + | 'moon' + | 'nature' + | 'note' + | 'note-add' + | 'notification' + | 'number-one' + | 'order' + | 'order-batches' + | 'order-draft' + | 'order-filled' + | 'order-first' + | 'order-fulfilled' + | 'order-repeat' + | 'order-unfulfilled' + | 'orders-status' + | 'organization' + | 'outdent' + | 'outgoing' + | 'package' + | 'package-cancel' + | 'package-fulfilled' + | 'package-on-hold' + | 'package-reassign' + | 'package-returned' + | 'page' + | 'page-add' + | 'page-attachment' + | 'page-clock' + | 'page-down' + | 'page-heart' + | 'page-list' + | 'page-reference' + | 'page-remove' + | 'page-report' + | 'page-up' + | 'pagination-end' + | 'pagination-start' + | 'paint-brush-flat' + | 'paint-brush-round' + | 'paper-check' + | 'partially-complete' + | 'passkey' + | 'paste' + | 'pause-circle' + | 'payment' + | 'payment-capture' + | 'payout' + | 'payout-dollar' + | 'payout-euro' + | 'payout-pound' + | 'payout-rupee' + | 'payout-yen' + | 'person' + | 'person-add' + | 'person-exit' + | 'person-filled' + | 'person-list' + | 'person-lock' + | 'person-remove' + | 'person-segment' + | 'personalized-text' + | 'phablet' + | 'phone' + | 'phone-down' + | 'phone-down-filled' + | 'phone-in' + | 'phone-out' + | 'pin' + | 'pin-remove' + | 'plan' + | 'play' + | 'play-circle' + | 'plus' + | 'plus-circle' + | 'plus-circle-down' + | 'plus-circle-filled' + | 'plus-circle-up' + | 'point-of-sale' + | 'point-of-sale-register' + | 'price-list' + | 'print' + | 'product' + | 'product-add' + | 'product-cost' + | 'product-filled' + | 'product-list' + | 'product-reference' + | 'product-remove' + | 'product-return' + | 'product-unavailable' + | 'profile' + | 'profile-filled' + | 'question-circle' + | 'question-circle-filled' + | 'radio-control' + | 'receipt' + | 'receipt-dollar' + | 'receipt-euro' + | 'receipt-folded' + | 'receipt-paid' + | 'receipt-pound' + | 'receipt-refund' + | 'receipt-rupee' + | 'receipt-yen' + | 'receivables' + | 'redo' + | 'referral-code' + | 'refresh' + | 'remove-background' + | 'reorder' + | 'replace' + | 'replay' + | 'reset' + | 'return' + | 'reward' + | 'rocket' + | 'rotate-left' + | 'rotate-right' + | 'sandbox' + | 'save' + | 'savings' + | 'scan-qr-code' + | 'search' + | 'search-add' + | 'search-list' + | 'search-recent' + | 'search-resource' + | 'select' + | 'send' + | 'settings' + | 'share' + | 'shield-check-mark' + | 'shield-none' + | 'shield-pending' + | 'shield-person' + | 'shipping-label' + | 'shipping-label-cancel' + | 'shopcodes' + | 'slideshow' + | 'smiley-happy' + | 'smiley-joy' + | 'smiley-neutral' + | 'smiley-sad' + | 'social-ad' + | 'social-post' + | 'sort' + | 'sort-ascending' + | 'sort-descending' + | 'sound' + | 'split' + | 'sports' + | 'star' + | 'star-circle' + | 'star-filled' + | 'star-half' + | 'star-list' + | 'status' + | 'status-active' + | 'stop-circle' + | 'store' + | 'store-import' + | 'store-managed' + | 'store-online' + | 'sun' + | 'table' + | 'table-masonry' + | 'tablet' + | 'target' + | 'tax' + | 'team' + | 'text' + | 'text-align-center' + | 'text-align-left' + | 'text-align-right' + | 'text-block' + | 'text-bold' + | 'text-color' + | 'text-font' + | 'text-font-list' + | 'text-grammar' + | 'text-in-columns' + | 'text-in-rows' + | 'text-indent' + | 'text-indent-remove' + | 'text-italic' + | 'text-quote' + | 'text-title' + | 'text-underline' + | 'text-with-image' + | 'theme' + | 'theme-cart' + | 'theme-edit' + | 'theme-store' + | 'theme-template' + | 'three-d-environment' + | 'thumbs-down' + | 'thumbs-up' + | 'tip-jar' + | 'toggle-off' + | 'toggle-on' + | 'transaction' + | 'transaction-fee-add' + | 'transaction-fee-dollar' + | 'transaction-fee-euro' + | 'transaction-fee-pound' + | 'transaction-fee-rupee' + | 'transaction-fee-yen' + | 'transfer' + | 'transfer-in' + | 'transfer-internal' + | 'transfer-out' + | 'truck' + | 'undo' + | 'unknown-device' + | 'unlock' + | 'upload' + | 'variant' + | 'variant-list' + | 'video' + | 'video-list' + | 'view' + | 'viewport-narrow' + | 'viewport-short' + | 'viewport-tall' + | 'viewport-wide' + | 'wallet' + | 'wand' + | 'watch' + | 'wifi' + | 'work' + | 'work-list' + | 'wrench' + | 'x' + | 'x-circle' + | 'x-circle-filled'; +/** + * Like `Extract`, but ensures that the extracted type is a strict subtype of the input type. */ export type ExtractStrict = Extract; -/** - * Represents CSS shorthand properties that accept one to four values. - * Supports specifying values for all four sides: top, right, bottom, and left. - * - * - `T`: Single value that applies to all four sides. - * - `${T} ${T}`: Two values for block axis (top/bottom) and inline axis (left/right). - * - `${T} ${T} ${T}`: Three values for block-start (top), inline axis (left/right), and block-end (bottom). - * - `${T} ${T} ${T} ${T}`: Four values for block-start (top), inline-end (right), block-end (bottom), and inline-start (left). - * @publicDocs - */ export type MaybeAllValuesShorthandProperty = | T | `${T} ${T}` | `${T} ${T} ${T}` | `${T} ${T} ${T} ${T}`; -/** - * Represents CSS shorthand properties that accept one or two values. - * Supports specifying the same value for both dimensions or different values. - * - * - `T`: Single value that applies to both dimensions. - * - `${T} ${T}`: Two values for block axis (vertical) and inline axis (horizontal). - * @publicDocs - */ export type MaybeTwoValuesShorthandProperty = T | `${T} ${T}`; -/** - * Makes a property responsive by allowing it to be set conditionally based on container query conditions. - * The value can be either a base value or a container query string. - * - * - `T`: Base value that applies in all conditions. - * - `@container${string}`: Container query string for conditional responsive styling based on container size. - * @publicDocs - */ export type MaybeResponsive = T | `@container${string}`; /** - * A utility type that enables autocomplete for specific string literals while still accepting any string value. - * By intersecting `string` with an empty object type, this prevents TypeScript from widening literal types, - * preserving IDE suggestions for known values while maintaining flexibility for custom strings. - * - * @publicDocs + * Prevents widening string literal types in a union to `string`. + * @example + * type PropName = 'foo' | 'bar' | string + * // ^? string + * type PropName = 'foo' | 'bar' | (string & {}) + * // ^? 'foo' | 'bar' | (string & {}) */ export type AnyString = string & {}; /** - * A utility type representing an optional space character for use in string literal type composition. - * Allows flexible formatting of compound values where spacing is a matter of preference rather than semantic difference. + * This is purely to give the ability + * to have a space or not in the string literal types. * - * @publicDocs + * For example in the `aspectRatio` property, `16/9` and `16 / 9` are both valid. */ export type optionalSpace = '' | ' '; interface BadgeProps$1 extends GlobalProps { /** - * The text label displayed within the badge, typically a short status indicator or category label. + * The content of the Badge. */ children?: ComponentChildren; /** - * The semantic meaning and color treatment of the component. - * - * - `info`: Informational content or helpful tips. - * - `success`: Positive outcomes or successful states. - * - `warning`: Important warnings about potential issues. - * - `critical`: Urgent problems or destructive actions. - * - `auto`: Automatically determined based on context. - * - `neutral`: General information without specific intent. - * - `caution`: Advisory notices that need attention. + * Sets the tone of the Badge, based on the intention of the information being conveyed. * * @default 'auto' */ tone?: ToneKeyword; /** - * Controls the visual weight and emphasis of the badge. - * - * - `base`: Standard weight with moderate emphasis, suitable for most use cases. - * - `strong`: Increased visual weight for higher emphasis and prominence. + * Modify the color to be more or less intense. * * @default 'base' */ color?: ColorKeyword; /** - * An icon displayed inside the badge to provide additional visual context or reinforce the badge's meaning. - * Accepts any icon name from the icon library or a custom string identifier. + * The type of icon to be displayed in the badge. * * @default '' */ icon?: IconType | AnyString; /** - * The position of the icon relative to the badge text. - * - * - `start`: Places the icon before the text (left in left-to-right languages, right in right-to-left languages). - * - `end`: Places the icon after the text (right in left-to-right languages, left in right-to-left languages). - * - * @default 'start' + * The position of the icon in relation to the text. */ iconPosition?: 'start' | 'end'; /** - * The size of the badge component. Available sizes range from `small-500` (smallest) to `large-500` (largest), with `base` providing the default medium size. + * Adjusts the size. * * @default 'base' */ @@ -1006,52 +887,58 @@ interface BadgeProps$1 extends GlobalProps { } interface BannerProps$1 extends GlobalProps, ActionSlots { /** - * The heading text displayed at the top of the banner. + * The title of the banner. * * @default '' */ heading?: string; /** - * The main message content displayed within the banner, providing important information or guidance to users. + * The content of the Banner. */ children?: ComponentChildren; /** - * The semantic meaning and color treatment of the component. + * Sets the tone of the Banner, based on the intention of the information being conveyed. * - * - `info`: Informational content or helpful tips. - * - `success`: Positive outcomes or successful states. - * - `warning`: Important warnings about potential issues. - * - `critical`: Urgent problems or destructive actions. - * - `auto`: Automatically determined based on context. + * The banner is a live region and the type of status will be dictated by the Tone selected. + * + * - `critical` creates an [assertive live region](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/alert_role) that is announced by screen readers immediately. + * - `neutral`, `info`, `success`, `warning` and `caution` creates an [informative live region](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/status_role) that is announced by screen readers after the current message. + * + * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions + * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/alert_role + * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/status_role * * @default 'auto' */ tone?: ToneKeyword; /** - * Whether the banner content can be collapsed. When true, child elements are initially hidden but can be - * revealed by the user expanding the banner. + * Makes the content collapsible. + * A collapsible banner will conceal child elements initially, but allow the user to expand the banner to see them. * * @default false */ collapsible?: boolean; /** - * Whether the banner displays a close button that allows users to dismiss it. + * Determines whether the close button of the banner is present. * - * When the close button is pressed, the `dismiss` event fires, then `hidden` is set to `true`, - * any animation completes, and the `afterhide` event fires. + * When the close button is pressed, the `dismiss` event will fire, + * then `hidden` will be true, + * any animation will complete, + * and the `afterhide` event will fire. * * @default false */ dismissible?: boolean; /** - * A callback fired when the banner is dismissed by the user clicking the close button. - * Does not fire when setting `hidden` manually. + * Event handler when the banner is dismissed by the user. + * + * This does not fire when setting `hidden` manually. * - * The `hidden` property is `false` when this event fires. + * The `hidden` property will be `false` when this event fires. */ onDismiss?: (event: Event) => void; /** - * A callback fired when the banner has fully hidden, including after any hide animations have completed. + * Event handler when the banner has fully hidden. * * The `hidden` property will be `true` when this event fires. * @@ -1061,35 +948,33 @@ interface BannerProps$1 extends GlobalProps, ActionSlots { */ onAfterHide?: (event: Event) => void; /** - * Controls whether the banner is visible or hidden. + * Determines whether the banner is hidden. * - * When using a controlled component pattern and the banner is `dismissible`, - * update this property to `true` when the `dismiss` event fires. + * If this property is being set on each framework render (as in 'controlled' usage), + * and the banner is `dismissible`, + * ensure you update app state for this property when the `dismiss` event fires. * - * You can hide the banner programmatically by setting this to `true` even if it's not `dismissible`. + * If the banner is not `dismissible`, it can still be hidden by setting this property. * * @default false */ hidden?: boolean; } -/** @publicDocs */ export interface DisplayProps { /** - * The outer display type of the component, The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). + * Sets the outer display type of the component. The outer type sets a component’s participation in [flow layout](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flow_layout). * * - `auto`: the component’s initial value. The actual value depends on the component and context. * - `none`: hides the component from display and removes it from the accessibility tree, making it invisible to screen readers. * - * Learn more about the [display property](https://developer.mozilla.org/en-US/docs/Web/CSS/display). - * + * @see https://developer.mozilla.org/en-US/docs/Web/CSS/display * @default 'auto' */ display?: MaybeResponsive<'auto' | 'none'>; } -/** @publicDocs */ export interface AccessibilityRoleProps { /** - * The semantic meaning of the component’s content. When set, + * Sets the semantic meaning of the component’s content. When set, * the role will be used by assistive technologies to help users * navigate the page. * @@ -1100,63 +985,31 @@ export interface AccessibilityRoleProps { */ accessibilityRole?: AccessibilityRole; } -/** - * Defines the semantic role of a component for assistive technologies like screen readers. - * - * Accessibility roles help users with disabilities understand the purpose and structure of content. - * These roles map to HTML elements and ARIA roles, providing semantic meaning beyond visual presentation. - * - * Use these roles to: - * - Improve navigation for screen reader users - * - Provide semantic structure to your UI - * - Ensure proper interpretation by assistive technologies - * - * Learn more about [ARIA roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles) in the MDN web docs. - * - * - `main`: Indicates the primary content area of the page. - * - `header`: Marks a component as a header containing introductory content or navigation. - * - `footer`: Designates content containing information like copyright, navigation links, or privacy statements. - * - `section`: Defines a generic thematic grouping of content that should have a heading or accessible label. - * - `aside`: Marks supporting content that relates to but is separate from the main content. - * - `navigation`: Identifies major groups of navigation links for moving around the site or page. - * - `ordered-list`: Represents a list where the order of items is meaningful. - * - `list-item`: Identifies an individual item within a list. - * - `list-item-separator`: Acts as a visual and semantic divider between items in a list. - * - `unordered-list`: Represents a list where the order of items is not meaningful. - * - `separator`: Creates a divider that separates and distinguishes sections of content. - * - `status`: Defines a live region for advisory information that is not urgent enough to be an alert. - * - `alert`: Marks important, time-sensitive information that requires the user's immediate attention. - * - `generic`: Creates a semantically neutral container element with no inherent meaning. - * - `presentation`: Removes semantic meaning from an element while preserving its visual appearance. - * - `none`: Synonym for `presentation`, removes semantic meaning while keeping visual styling. - * @publicDocs - */ export type AccessibilityRole = /** - * An accessibility role used to indicate the primary content. + * Used to indicate the primary content. * * In an HTML host, `main` will render a `

` element. * Learn more about the [`
` element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/main) and its [implicit role](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/main_role) in the MDN web docs. */ | 'main' /** - * An accessibility role used to indicate the component is a header. + * Used to indicate the component is a header. * * In an HTML host `header` will render a `
` element. * Learn more about the [`
` element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/header) and its [implicit role](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/main_role) in the MDN web docs. */ | 'header' /** - * An accessibility role used to display information such as copyright information, navigation links, and privacy statements. + * Used to display information such as copyright information, navigation links, and privacy statements. * * In an HTML host `footer` will render a `